De PHPhulp kroeg
background-image (divs IE)
Ik ben bezig met een website.
Op safari ziet er alles netjes uit.
maar op Firefox en Internet Explore zijn de div's toch wel anders..
maar wat kan de fout zijn?
style code:
Quote:
<div class="right">
</div>
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php
$sql = "SELECT * FROM blokken WHERE hidden='0' ORDER BY border";
$query = mysql_query($sql) or die (mysql_error ());
if(mysql_num_rows($query) == 0){
}else{
$i = 0;
while($row = mysql_fetch_assoc($query)){
if($i == 0){
echo '<div class="right_top">'.$row['naam'].'</div>
<div class="right_middle">'.nl2br($row['text']).'<br><br></div>
';
}else{
echo '<div class="right_top2">'.$row['naam'].'</div>
<div class="right_middle">'.nl2br($row['text']).'<br><br></div>
';
}
$i ++;
}
echo '<div class="right_under"></div>';
}
?>
$sql = "SELECT * FROM blokken WHERE hidden='0' ORDER BY border";
$query = mysql_query($sql) or die (mysql_error ());
if(mysql_num_rows($query) == 0){
}else{
$i = 0;
while($row = mysql_fetch_assoc($query)){
if($i == 0){
echo '<div class="right_top">'.$row['naam'].'</div>
<div class="right_middle">'.nl2br($row['text']).'<br><br></div>
';
}else{
echo '<div class="right_top2">'.$row['naam'].'</div>
<div class="right_middle">'.nl2br($row['text']).'<br><br></div>
';
}
$i ++;
}
echo '<div class="right_under"></div>';
}
?>
</div>
pagina code:
Quote:
.right_top{
background-image: url('images/right_top.png');
width: 255px;
height: 12px;
text-align: center;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 0.8em;
}
.right_top2{
background-image: url('images/right_top2.png');
width: 255px;
height: 12px;
text-align: center;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 0.8em;
}
.right_middle{
background-image: url('images/rightbar.png');
width: 250px;
font-size: 14px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding-left: 15px;
padding-right: 10px;
}
.right_under{
background-image: url('images/right_under.png');
width: 275px;
height: 21px;
}
background-image: url('images/right_top.png');
width: 255px;
height: 12px;
text-align: center;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 0.8em;
}
.right_top2{
background-image: url('images/right_top2.png');
width: 255px;
height: 12px;
text-align: center;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 0.8em;
}
.right_middle{
background-image: url('images/rightbar.png');
width: 250px;
font-size: 14px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding-left: 15px;
padding-right: 10px;
}
.right_under{
background-image: url('images/right_under.png');
width: 275px;
height: 21px;
}
wat is IE css hack?
en hoe gebruik ik dat
wat is IE css hack?
en hoe gebruik ik dat
--edit--
Uhh :s ik was het niet xD
Gewijzigd op 19/05/2010 23:34:07 door Mitchel V
Zo iets?
Je html / php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<?php
echo '<div class="right">';
$sql = mysql_query("SELECT * FROM blokken WHERE hidden = '0' ORDER BY border");
if($sql)
{
if(mysql_num_rows($sql) > 0)
{
$i = 0;
while($row = mysql_fetch_assoc($sql))
{
if($i == 0)
{
echo '<p class="right_top">'.$row['naam'].'</p>';
echo '<div class="right_middle">'.nl2br($row['text']).'</div>';
}
else
{
echo '<p class="right_top2">'.$row['naam'].'</p>';
echo '<div class="right_middle">'.nl2br($row['text']).'</div>';
}
$i ++;
}
}
else
{
echo 'Geen items gevonden.';
}
}
else
{
echo 'Fout in query: <br />';
echo mysql_error();
}
echo '<p class="right_under"></p>';
echo '</div>';
?>
echo '<div class="right">';
$sql = mysql_query("SELECT * FROM blokken WHERE hidden = '0' ORDER BY border");
if($sql)
{
if(mysql_num_rows($sql) > 0)
{
$i = 0;
while($row = mysql_fetch_assoc($sql))
{
if($i == 0)
{
echo '<p class="right_top">'.$row['naam'].'</p>';
echo '<div class="right_middle">'.nl2br($row['text']).'</div>';
}
else
{
echo '<p class="right_top2">'.$row['naam'].'</p>';
echo '<div class="right_middle">'.nl2br($row['text']).'</div>';
}
$i ++;
}
}
else
{
echo 'Geen items gevonden.';
}
}
else
{
echo 'Fout in query: <br />';
echo mysql_error();
}
echo '<p class="right_under"></p>';
echo '</div>';
?>
Je css
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
div.right {
width: 255px;
height: 12px;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-image: url('images/right_top.png');
}
p.right_top {
width: 255px;
height: 12px;
margin: 0px;
padding: 0.8em;
float: left;
text-align: center;
background-image: url('images/right_top.png');
}
p.right_top2 {
width: 255px;
height: 12px;
margin: 0px;
padding: 0.8em;
float: left;
text-align: center;
background-image: url('images/right_top2.png');
}
div.right_middle {
width: 250px;
font-size: 14px;
padding-left: 15px;
padding-right: 10px;
float: left;
background-image: url('images/rightbar.png');
}
p.right_under {
width: 275px;
height: 21px;
margin: 0px;
padding: 0px;
background-image: url('images/right_under.png');
}
width: 255px;
height: 12px;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-image: url('images/right_top.png');
}
p.right_top {
width: 255px;
height: 12px;
margin: 0px;
padding: 0.8em;
float: left;
text-align: center;
background-image: url('images/right_top.png');
}
p.right_top2 {
width: 255px;
height: 12px;
margin: 0px;
padding: 0.8em;
float: left;
text-align: center;
background-image: url('images/right_top2.png');
}
div.right_middle {
width: 250px;
font-size: 14px;
padding-left: 15px;
padding-right: 10px;
float: left;
background-image: url('images/rightbar.png');
}
p.right_under {
width: 275px;
height: 21px;
margin: 0px;
padding: 0px;
background-image: url('images/right_under.png');
}
Ik denk dat dit beter werkt, nog niet getest maar dat kan je zelf denk ook wel ;)
Gewijzigd op 20/05/2010 15:36:13 door Milo S
Ik heb al op google gezocht...
maar ik snap de bedoeling niet..
en ik zie het verschil niet xD
Gewijzigd op 21/05/2010 11:08:29 door Mitchel V
Quote:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
Is dit een serieuse layout, met serieuse header?
Ja klopt hoezo?
Je header is uitgerekt in paint en opnieuw opgeslagen?
Als ik jou was zou ik een beetje rond snuffelen op het web hoe populaire websites hedendaags eruit zien. Dan zul je zelf ook het verschil zien.
Maar de rest van de layout.. is dat zo erg? xD
Ik heb zelf altijd moeite met creativiteit dus bedankt voor je feed-back
De divs plaatjes doen het nog steeds niet :(
Kijk gewoon even rond, je ziet echt nooit meer layouts zoals die jij net post. Tenzij ze echt outdated zijn.
Want moet ik dan doen als ik wil dat hij boven aan een ronde frame heeft en onder ook...?
dus eigelijk wat ik nu heb, hoe moet ik dat anders doen?
ik hoef deze link toch helemaal niet af te sluiten?
Code (php)
1
2
3
4
2
3
4
Line 5, Column 57: end tag for "link" omitted, but OMITTAG NO was specified
<link href="style.css" rel="stylesheet" type="text/css">
?
You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
<link href="style.css" rel="stylesheet" type="text/css">
?
You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
Edit 1 (De Kritiek)
Sorry dat ik het zeg, maar bij het stelen van je plaatjes kap ik er mee... er zitten allemaal debiele randen die er niet horen te zitten met juist gebruik van css en html.
Misschien dat we je eerst moeten leren om goede plaatjes te nemen (mits je die nodig hebt) en dat dan netjes te verwerken.
Vat dit op als opbouwende kritiek en niet als soort van afkraak poging.
Edit 2 (De Uitleg)
Je begint natuurlijk met een mooie doctype, welke voor jou handig is moet je zelf even gaan onderzoeken (ben hier geen expert in en gebruik gewoon standaard dreamweaver shizzle)
Dan de standaard html tags, deze geef je natuurlijk een kleine tab om de leesbaarheid te verhogen.
<head>*1</head>
<body>*2</body>
*1:
Dan begin je met de meta tags.
<meta name="DESCRIPTION" content="" />
<meta name="KEYWORDS" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
De stijlbladen:
<link href="naam.css" rel="stylesheet" type="text/css">
Pagina titel
<title>pagina titel</title>
*2:
Hierzo komt je lay-out in div's, p's etc.
Persoonlijk denk ik dat als je de volgende html opbouw hebt (binnen de body tags) je jouw site heel netjes kan maken.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div class="wrapper">
<ul class="top_menu">
<li><a class="top_men" href="">Sample</a></li>
<li><a class="top_men" href="">Sample</a></li>
<li><a class="top_men" href="">Sample</a></li>
</ul>
<div class="header">
</div>
<div class="container">
<div class="content">
</div>
<div class="right">
</div>
</div>
<div class="footer">
�� BetaalbaarKozijn 2010 - Design & Coding by Voor en Achternaam
</div>
</div>
<ul class="top_menu">
<li><a class="top_men" href="">Sample</a></li>
<li><a class="top_men" href="">Sample</a></li>
<li><a class="top_men" href="">Sample</a></li>
</ul>
<div class="header">
</div>
<div class="container">
<div class="content">
</div>
<div class="right">
</div>
</div>
<div class="footer">
�� BetaalbaarKozijn 2010 - Design & Coding by Voor en Achternaam
</div>
</div>
Ik ga met deze simpele code eens kijken hoever ik kom, en aan de hand daarvan proberen jouw verder goede uitleg te geven hoop dat beetje duidelijk is?
Gr,
Gewijzigd op 20/05/2010 18:13:30 door Milo S
maar hij is nog iets buggeder dan die van mij xD
Als ik de afbeeldingen had weet ik zeker dat ik hem nu in een half uur af had... (moet namelijk wel alle afbeeldingen netjes maken :P.)
De html en css opbouw heb ik al, die is echt rete makkelijk!
Probeer zelf eens wat... tip ga eens goed gebruik maken van margin, padding en float dan ben je zo klaar...
Ik begin me te schaamen.
de plaatjes waren: right_top.png.psd :(
Daarom deden ze het niet.
changed.
heeft iemand nog tip voor de lay out wat anders kan of zow? :)