HTML interesse |
|
Hello Forumgenoten,
Ik heb een probleempje met CSS
Kben aant proberen men layout men divs te maken (ipv tabellen)
T lukt al aardig tot zowat een uur geleden.
Het probleem is het volgende:
<div id="menu">
<div class="menuitem1">
<div class="pijl">
<img src="images/2.gif" alt="pijl" />
</div>
<div class="menucontent">
HOMEPAGE
</div>
</div>
<div class="menuitem2">
<div class="pijl">
<img src="images/2.gif" alt="pijl" />
</div>
<div class="menucontent">
LINK 1
</div>
</div>
</div>
<div id="menu"> <div class="menuitem1"> <div class="pijl"> <img src="images/2.gif" alt="pijl" /> </div> <div class="menucontent"> HOMEPAGE </div> </div> <div class="menuitem2"> <div class="pijl"> <img src="images/2.gif" alt="pijl" /> </div> <div class="menucontent"> </div> </div> </div>
En in men css:
#menu {
margin-top:10px;
border-style:solid;
border-width:1px;
border-color:#d8d8d8;
padding:0px;
width:207px;
}
.menuitem1{
margin-top:0px;
background-color:#dcdcdc;
width:205px;
height:27px;
padding:0px;
margin-bottom:0px;
}
.menuitem2{
margin-top:1px;
background-color:#d8d8d8;
width:205px;
height:27px;
padding:0px;
margin-bottom:0px;
}
.pijl{
float:left;
margin-top:0px;
padding:0px;
}
.menucontent{
margin-left:37px;
margin-top:3px;
padding:0px;
height:24px;
}
#menu { margin-top:10px; border-style:solid; border-width:1px; border-color:#d8d8d8; padding:0px; width:207px; } .menuitem1{ margin-top:0px; background-color:#dcdcdc; width:205px; height:27px; padding:0px; margin-bottom:0px; } .menuitem2{ margin-top:1px; background-color:#d8d8d8; width:205px; height:27px; padding:0px; margin-bottom:0px; } .pijl{ float:left; margin-top:0px; padding:0px; } .menucontent{ margin-left:37px; margin-top:3px; padding:0px; height:24px; }
Een vb is te vinden op
http://users.pandora.be/webdesign/vb.htm
De bedoeling is dus dat de tekst in menucontent 3 px naar onder gaat.
In IE werkt het goed maar in FF verplaatst hij de hele div menuitem1 naar onder
Heeft iemand een oplossing voor dit probleem?
Groeten en alvast bedankt!
Raf
|