PHP ver gevorderde |
|
Hej,
Dit zou standaard CSS moeten zijn, maar ik kom er niet uit. Ik heb 3 div's, met een breedte van 25%, 50% en weer 25%. Ik wil ze netjes in een rijtje naast elkaar hebben.
Ik heb een aparte html-file gemaakt waarin ik alleen de style van de 5 divs gezet (een voor de container en een voor de spacer).
In dat html-bestand wordt alles wel neergezet zoals ik 't wil, maar als ik het implenteer op mn site (met dezelfde stylesheet en code) dan wordt de 'middelste' div op 3/4 van de breedte van de container gezet, en de 'rechtse' div komt in het midden op een nieuwe regel. Ik heb al gespeeld met de breedtes en met de margin's en paddings, zonder succes (anders zou ik 't ook niet hier vragen ).
.spacer {
clear: both;
}
.nav {
width: 50%;
font-size: 13px;
font-weight: bold;
color: #555555;
padding-top: 4px;
padding-bottom: 4px;
margin-left: 0px;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
.nav .left {
float: left;
margin-left: 0px;
width: 25%;
text-align: left;
}
.nav .middle {
float: left;
margin-left: 0px;
width: 50%;
text-align: center;
}
.nav .right {
float: left;
margin-left: 0px;
width: 25%;
text-align: right;
}
<div class="nav">
<div class="spacer"><!-- --></div>
<div class="left">
<<Previous
</div>
<div class="middle">
Page 1 of 1
</div>
<div class="right">
Next>>
</div>
<div class="spacer"><!-- --></div>
</div>
.spacer { clear: both; } .nav { width: 50%; font-size: 13px; font-weight: bold; color: #555555; padding-top: 4px; padding-bottom: 4px; margin-left: 0px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; } .nav .left { float: left; margin-left: 0px; width: 25%; text-align: left; } .nav .middle { float: left; margin-left: 0px; width: 50%; text-align: center; } .nav .right { float: left; margin-left: 0px; width: 25%; text-align: right; } <div class="nav"> <div class="spacer"><!-- --></div> <div class="left"> <<Previous </div> <div class="middle"> Page 1 of 1 </div> <div class="right"> Next>> </div> <div class="spacer"><!-- --></div> </div>
|