CSS hulp gevraagd

**Eddy B.** · 763 × bekeken sinds 19-02-2010, 18:44

Hier heb ik een pagina met dubbele column voor content links en rechts in de div-body, maar float werkt nogal raar, weet iemand waarom de pagina niet goed word weergeven?

**J. de Boer** · 19-02-2010, 18:52

#body {
overflow: auto;
}

**Eddy B.** · 19-02-2010, 18:53

Hartelijk dank! In DW geeft het nu een heel raar beeld, maar in de browser ziet het er goed uit. Dankje.

**J. de Boer** · 19-02-2010, 18:57

Eigenlijk hoor je Design view van Dreamweaver niet te gebruiken. Het geeft (bij mij althans) nooit een goede weergave van een website. Test daarom altijd je websites uit in een (of meerdere) browser(s).

**Eddy B.** · 19-02-2010, 18:58

Ja ach, wat hoort, vind het gewoon lekker om te zien, maarja, inderdaad, van belang is het niet.

**Jack de Vreugd** · 22-02-2010, 11:41

In DW cs4 zit een knopje als je daar op klikt is die meestal wel goed te zien : )

**Tom Heek** · 22-02-2010, 12:03

Dit probleem heb ik ook, alleen ik heb al overflow: auto;
Hoe kan ik ervoor zorgen dat een afbeelding altijd onderin de layout staat?

**Eddy B.** · 22-02-2010, 12:13

Jack, welk knopje dan?

Tom, geen idee, ben geen CSS expert.

**Jasper van C** · 22-02-2010, 12:26

Origineel gepost door Tom Heek

Dit probleem heb ik ook, alleen ik heb al overflow: auto;
Hoe kan ik ervoor zorgen dat een afbeelding altijd onderin de layout staat?

Heb je online voorbeeld?

**Tom Heek** · 22-02-2010, 12:37

Het gaat hier om de website www.d48.nl.
Het plaatje bottom.png moet altijd tegen de onderkant van de border aanstaan.

**gast2960** · 22-02-2010, 12:41

Stel je code ziet er zo uit:

Code:

<div id="top">

   <div id="left">

   </div>

   <div id="right">

   </div>

</div>

<div id="bottom">

</div>

id #left krijgt float:left;
id #right krijgt float:right;
(logisch)

Zodra er 1 float in de website wordt toegepast, dan wordt de rest van de pagina daar op afgesteld.
Om dit tegen te gaan lijkt de oplossing:
overflow:auto; of overflow:hidden; (deze werkt nog stabieler)
Helaas brengen deze oplossingen vaak een hoop andere problemen met zich mee,
en het floaten is hiermee niet verholpen maar verdoezeld.

Wat de beste manier is, de onderstaande div, dus #bottom te laten zeggen dat het floaten klaar is.

#bottom krijgt in de css
clear:both;
Dat wil zeggen dat de float links en rechts wordt stopgezet. Als het goed is laat hij nou alle divs goed zien.
Aanvullend bericht:

Origineel gepost door Tom Heek

Het gaat hier om de website www.d48.nl.
Het plaatje bottom.png moet altijd tegen de onderkant van de border aanstaan.

Dat is een heel ander probleem,
je wilt de div mee laten rekken tot aan het einde van de pagina.
Helaas kunnen divs niet zoals met tabellen gelijk aan elkaar meerekken,
de beste oplossing lijkt mij dat je die achtergrond instelt in de container.

Vervolgens de langste divs een witte border geven, en je hebt hetzelfde effect.

**Tom Heek** · 22-02-2010, 12:46

Mijn code ziet er dus niet zo uit, hij ziet er grofweg zo uit:

Code:

<div class="content">
<div class="header">Day 48</div>
<!--Hier zit een border omheen-->
<div class="menu">Menu</div>
<div style="background: url(img/bottom.png) no-repeat; width: 200px;">Nieuwsbrief</div>
<!--Stop border menu, start border content-->
<div class="content">Content</div>
<div style="background: url(img/bottom.png) no-repeat; width: 200px;"></div>
<!--Stop border content, start border footer-->
<div class="footer">Footer</div>
<!--Stop border footer-->
</div>

CSS hulp gevraagd