Probleem css opmaak padding

Door Kees Mulder op 28-05-2014 10:08

509 views

Ik ben bezig met een responsive website en heb dan een probleem met wat ik wil qua opmaak.

Ik maak website met een linker deel en rechter deel en dan links 25% en 75%. Alleen als ik een padding bij de 25% wil doen van 20px; dan komt het rechterdeel er onder te staan. Hoe kan ik dit oplossen?


<div class="grid" style="width: 100%; max-width: 960px; margin: 0 auto;">

	<div class="left" style="width: 25%; float: left; background-color: #ff0000; padding-right: 20px;">
    links
    </div>
    
    <div class="right" style="width: 75%; float: right; background-color: #096;">
    rechts
    </div>
 
</div>

Mich

28-05-2014 10:34

Als je begrijpt wat er gebeurt is dat natuurlijk logisch. Je hebt een div van 100% dus elke border,padding of margin is teveel. En als het niet naast elkaar past komt het onder elkaar.
Wat je kan doen in een dubbele div gebruiken.


    <div class="left" style="width: 25%; float: left; background-color: #ff0000;">
      <div style=" padding-right: 20px;">links</div>
    </div>

Zo heb je nog steeds een breedte van 100%, maar daarbinnen kun je doen wat je wilt.

Wel een tip: Je kunt beter je CSS apart neerzetten i.p.v. inline styling.

Reageren

Inloggen om te reageren