Toon posts:

Container DIV rekt niet mee (al heel veel dingen geprobeerd)

Pagina: 1
Acties:

  • WiNlUx
  • Registratie: april 2002
  • Laatst online: 15-10 11:29
Ik ben bezig met een website, bestaande uit alleen maar DIV's.

Nu ben ik al erg goed op weg, alleen zit ik met een probleem. De container DIV krijg ik niet meegerekt terwijl de andere DIV's dat wel doen!

Hier een voorbeeld:



Mijn CSS van die 3 DIV's ziet er zo uit:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
#container {
    width: 920px;
    min-height: 876px;
    margin: auto;
    background-image: url(../img/containerbg.png);
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-right-color: #5d4a29;
    border-bottom-color: #5d4a29;
    border-left-color: #5d4a29;
}

#contentcontainer {
    width: 900px;
    margin-bottom: 10px;
    background-color: #fdeddd;
    margin-top: -29px;
    margin-right: 10px;
    margin-left: 10px;
    border: 1px solid #d8c9a5;
    position:absolute;
}

#content 
{
    float: left;
    border: 1px solid #d8c9a5;
    width: 546px;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    background-color: #f2e5c5;
    font-family: Arial, Helvetica, sans-serif;
    color: #5d4a29;
    text-decoration: none;
    font-size: 13px;
    padding-left: 17px;
    padding-top: 16px;
    padding-right: 17px;
    padding-bottom: 16px;
}


Mijn vraag:

Hoe kan het zo zijn dat de #contentcontainer div wél meerekt, maar de #container div níet?

De #container heb ik al een "height: 100%" meegegeven, maar dat werkt niet. Als ik de height en min-height weglaat, rekt ie ook niet mee... Hoe kan dit, zie ik wat over het hoofd?

Bij #content moet de "float: left;" blijven staan, omdat rechts ervan ook nog een menu komt (dit heb ik al getest en werkt perfect).

Als ik bij #contentcontainer "position: absolute;" weghaal, en bij #content "float: left;", dan rekt de #container wel mee. Maar dan kan ik weer geen menu langs #content zetten...

Heb me rot gezocht op google, maar dat leverde weinig op na veel proberen. Ook hier weinig over gevonden.

Wie o wie kan mij helpen?

  • WiNlUx
  • Registratie: april 2002
  • Laatst online: 15-10 11:29
Zo. Ik heb het opgelost.

Zoals KIPMANS zei, flow en position: absolute gaan niet samen. Zodoende heb ik die position absolute weggehaald bij #contentcontainer, en aan #container en #contentcontainer "overflow: hidden;" toegevoegd.

Nu heb ik het volgende resultaat:

Pagina: 1


Nintendo Switch (OLED model) Apple iPhone 13 LG G1 Google Pixel 6 Call of Duty: Vanguard Samsung Galaxy S21 5G Apple iPad Pro (2021) 11" Wi-Fi, 8GB ram Nintendo Switch Lite

Tweakers vormt samen met Hardware Info, AutoTrack, Gaspedaal.nl, Nationale Vacaturebank, Intermediair en Independer DPG Online Services B.V.
Alle rechten voorbehouden © 1998 - 2021 Hosting door True

Tweakers maakt gebruik van cookies

Bij het bezoeken van het forum plaatst Tweakers alleen functionele en analytische cookies voor optimalisatie en analyse om de website-ervaring te verbeteren. Op het forum worden geen trackingcookies geplaatst. Voor het bekijken van video's en grafieken van derden vragen we je toestemming, we gebruiken daarvoor externe tooling die mogelijk cookies kunnen plaatsen.

Meer informatie vind je in ons cookiebeleid.

Sluiten

Forum cookie-instellingen

Bekijk de onderstaande instellingen en maak je keuze. Meer informatie vind je in ons cookiebeleid.

Functionele en analytische cookies

Deze cookies helpen de website zijn functies uit te voeren en zijn verplicht. Meer details

janee

    Cookies van derden

    Deze cookies kunnen geplaatst worden door derde partijen via ingesloten content en om de gebruikerservaring van de website te verbeteren. Meer details

    janee