[CSS] Div height zit te hoog

[Verwijderd]

Ik heb een probleem met een van mijn divs. Ik heb namelijk 4 div gemaakt (2 onder elkaar) maar de eerste van de 4 divs zit iets te hoog:

HTML:

<div class="sorosh1">sorosh1</div>
<div class="sorosh2">sorosh2</div>
<div class="sorosh3">sorosh3</div>
<div class="sorosh4">sorosh4</div>

Cascading Stylesheet:

.sorosh1{
float: left;
width: 300px;
height:100px;
background: #2295ca;
}
.sorosh2{
float: left;
width: 300px;
height:100px;
background: #000;
}
.sorosh3{
float: left;
width: 300px;
height:100px;
background: #000;
}
.sorosh4{
float: left;
width: 300px;
height:100px;
background: #2295ca;
}

/* container content (CSS): */
.container {
background: transparant;
padding: 20px;
width: 793px;
height:100%;
overflow: auto;
}

/* hele layout container (CSS): */
.layout {
    width: 835px;
    margin: 0px auto;
    padding: 20px;
    background: transparant;
}

Weet iemand wat ik fout doe? (Zal wel een domme fout zijn ) Ik heb de script hierboven wel in een aparte html bestandje bekeken. En daar doet die het gewoon goed in alle browsers. Ik heb ook niet per ongeluk een br tag geplaatst. Overgens heb ik bij class: sorosh1 dit geprobeerd:

margin-top:16px;
margin-bottom:-1px;

En dan ziet die er wel goed uit maar ik vraag me toch af waarom die het niet meteen goed doet?


Alvast bedankt,
shajansd

[ Voor 6% gewijzigd door Verwijderd op 21-12-2009 16:52 ]

[MoietyMe]

geef sorosh 2 en 4 eens een float right om mee te beginnen.

[disjfa]

Good Fella schreef op maandag 21 december 2009 @ 15:49:
geef sorosh 2 en 4 eens een float right om mee te beginnen.

En dat zou precies wat moeten doen anders dan de ts nu al wilt?

En voor de ts. De code die je nu geeft is niet anders dan de vorige, waar ook al niets mis mee was. Er zit iets meer in je bestand dan je nu post. En post nu niet weer klakeloos heel je css of html. Debug gewoon even wat met een firebug oid.

[ Voor 33% gewijzigd door disjfa op 21-12-2009 15:54 ]

[MoietyMe]

disjfa schreef op maandag 21 december 2009 @ 15:52:
[...]

En dat zou precies wat moeten doen anders dan de ts nu al wilt?

Niets, maar dat is imho wel netter.

Laat ik het zo zeggen: iets links laten floaten wat rechts staat komt bij mij raar over en kan ik niet tegen. Zal wel een persoonlijk trekje zijn.

[ Voor 25% gewijzigd door MoietyMe op 21-12-2009 16:53 ]

[disjfa]

Good Fella schreef op maandag 21 december 2009 @ 16:23:
[...]

Nies, maar dat is imho wel netter.

[NoFearWizz]

De code zoals jij nu geeft is 100% correct.

Als ik dit zelf toevoeg in een HTML file met DTD: Transitional krijg ik gewoon 4 blokken die links floaten.
Ik neem dan wel een container erom heen die 600px breed is. anders staat alles achter elkaar op 1920x1280.
Dit doet ie in IE 7/8, firefox 3.5 en Safari 4.

Je code is dan daarom denk ik ook niet volledig. Er staat meer in je HTML dan alleen wat je hier post.

[Verwijderd]

good fella...heb ik ook gedaan...maar dat zorgt er alleen voor dat de twee divs naar rechts gaan de hoogte blijft het zelde.

Disjfa....ik heb het met firebug gedaan....en ik ben er achter wat het probleem is:

De divs die ik heb gemaakt met tinyMCE zijn via mijn eigen cms in de database opgeslagen. Als ik naar me database ga dan zie ik dit:

code:

<div class="sorosh1">sorosh1</div>
<div class="sorosh2">sorosh2</div>
<div class="sorosh3">sorosh3</div>
<div class="sorosh4">sorosh4</div>

Dit klopt gewoon. Maar als ik naar me de pagina gaan via het firefox en naar de bron kijk dan zie ik na elke afsluiting van de div tag een <br/> tag. TinyMCE doet dit NIET! want ik heb het ook geprobeerd te maken zonder de tinyMCE editor. En in de databse wordt het gewoon normaal opgeslagen. Maar de browser (alle browsers) maken volgens mij dan automatisch een <br/> tag aan ofoz?

(Als ik de br tag verwijder met firebug na de sorosh1 div dan ziet het er gewoon normaal uit)

[Matis]

Ik mis idd de wrapper om je 4 divjes heen.

[disjfa]

Je moet ook geen "complexe" html gaan bouwen met een (online) wysiwyg editor

[ Voor 6% gewijzigd door disjfa op 21-12-2009 16:32 ]

[Cosca]

Verwijderd schreef op maandag 21 december 2009 @ 16:30:
good fella...heb ik ook gedaan...maar dat zorgt er alleen voor dat de twee divs naar rechts gaan de hoogte blijft het zelde.

Disjfa....ik heb het met firebug gedaan....en ik ben er achter wat het probleem is:

De divs die ik heb gemaakt met tinyMCE zijn via mijn eigen cms in de database opgeslagen. Als ik naar me database ga dan zie ik dit:

code:

<div class="sorosh1">sorosh1</div>
<div class="sorosh2">sorosh2</div>
<div class="sorosh3">sorosh3</div>
<div class="sorosh4">sorosh4</div>

Dit klopt gewoon. Maar als ik naar me de pagina gaan via het firefox en naar de bron kijk dan zie ik na elke afsluiting van de div tag een <br/> tag. TinyMCE doet dit NIET! want ik heb het ook geprobeerd te maken zonder de tinyMCE editor. En in de databse wordt het gewoon normaal opgeslagen. Maar de browser (alle browsers) maken volgens mij dan automatisch een <br/> tag aan ofoz?

(Als ik de br tag verwijder met firebug na de sorosh1 div dan ziet het er gewoon normaal uit)

dan zul je zelf ergens nl2br in je code hebben moeten staan

[Verwijderd]

disjfa zo complex zijn divjes toch niet:P divs maken met een edidtor moet we kunnen toch...(overgens zijn de divs voor de content van 1 pagina niet de hele layout;))

Cosca....ik kan je wel zoenen:P Het was idd de nl2br tag. Ik had hem bij het opbouwen van de pagina gebruik. Geen idee waarom eigenlijk:P maar het is opgelost bedankt voor jullie hulp!