Div container werkt niet

Pagina: 1
Acties:

  • Loev
  • Registratie: Augustus 2001
  • Laatst online: 05-02 11:54
Heren (en dames)

Na een hoop gezeur en gezeik heb mijn huidige website aan de praat gekregen. Nu gaan helaas de sponsoren zeuren dat ze te weinig in beeld zijn. Dus ik dacht, waarom gooi ik geen mooi sponsor divje onder het menu.
Zo gezegt zo gedaan. (dacht ik) Maar nu wil het sponsor divje niet onder het menu divje :?
Volgens mij berekenen de sponsor en content divje hun positie op het menu divje en dit natuurlijk niet de bedoeling.
Dit gebeurt er nu: http://www.dkvtoernooi.nl/index1.htm
De HTML code (enigzins opgeschoond)
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
    <div id="maincolumn">
        De container div
    
    
    <!-- start of menu -->
    <dl id="navigatie">
    Menu div
    </dl>
    <!-- end of menu -->
    
    <!-- start of countdown -->
    <div id="countdown">
    Sponsor div (heet nu nog even countdown)
    </div>
    <!-- end of countdown -->
    
    <!-- start of 'centercolumn' -->
    <div id="centercolumn">
         Content div
    </div>
    <!-- end of 'centercolumn' -->
</div>
</body>
</html>


En de css code:

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
#maincolumn {
    position:absolute;
    top: 25px;
    left: 150px;
    width: 660px;
    background: url(Images/main.gif) repeat-y;
    z-index:1;
}

#centercolumn {
    float: right;
    width:468px;
    margin-right:15px;
    margin-top:10px;
    background-image:url(Images/middle1.gif);
    z-index:2;
}

#leftcolumn {
    float: left;
    width:155px;
    margin-left:10px;
    margin-top:10px;
    background-image:url(Images/middle.gif);
    z-index:3;
}

#countdown {
    float: left;
    width: 155px;
    margin-left:10px;
    margin-top:210px;
    background-image:url(Images/middle.gif);
    z-index:4;
}


Wat doe ik fout? |:( :?

  • BtM909
  • Registratie: Juni 2000
  • Niet online

BtM909

Watch out Guys...

Waarom float je die countdown div eigenlijk? ;)

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.


  • Loev
  • Registratie: Augustus 2001
  • Laatst online: 05-02 11:54
Omdat de rest van divs ook floaten :x
En als ik dat doe (net geprobeerd :P ) dan gaat de omlijning van de div erg raar doen.
Kan het een beetje moeilijk omschrijven...

[ Voor 66% gewijzigd door Loev op 30-03-2006 13:47 ]


  • TeeDee
  • Registratie: Februari 2001
  • Laatst online: 23-02 22:14

TeeDee

CQB 241

1: Kijk nog eens goed naar de HTML.
Bijv:
- '[[lang:html]]' en [[charset]]
- forms in H1 elementen
- Verder lijkt me een UL in een DT overkill :)

2: Haal de margin-top:210px; eens weg en zet voor de zekerheid een clear:left bij #countdown?

Heart..pumps blood.Has nothing to do with emotion! Bored


  • Valor
  • Registratie: Mei 2005
  • Laatst online: 06-02 08:25

Valor

yummie spam

DarkJedi schreef op donderdag 30 maart 2006 @ 13:36:

Waarom zet je je menu trouwens ook niet in een div?

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
    <div id="maincolumn">
        De container div
    
    
    <!-- start of menu -->
    <dl id="navigatie">
    Menu div
    </dl>
    <!-- end of menu -->
       <br clear="all">   <----------------------------- TRY THIS
    
    <!-- start of countdown -->
    <div id="countdown">
    Sponsor div (heet nu nog even countdown)
    </div>
    <!-- end of countdown -->
    
    <!-- start of 'centercolumn' -->
    <div id="centercolumn">
         Content div
    </div>
    <!-- end of 'centercolumn' -->
</div>
</body>
</html>

[ Voor 45% gewijzigd door Valor op 30-03-2006 13:55 ]


  • Loev
  • Registratie: Augustus 2001
  • Laatst online: 05-02 11:54
TeeDee schreef op donderdag 30 maart 2006 @ 13:45:
1: Kijk nog eens goed naar de HTML.
Bijv:
- '[[lang:html]]' en [[charset]]
- forms in H1 elementen
- Verder lijkt me een UL in een DT overkill :)

2: Haal de margin-top:210px; eens weg en zet voor de zekerheid een clear:left bij #countdown?
1:
- Mijn fout erg slordig.
- Een vriend van mij (proffesineel webdesigner) zei dat het beste is ipv allemaal classes te maken
- Mhja... Nogmaals van een vriend de code gekregen, misschien kan er wel wat weg.

2: HELD! Het werkt :D Alleen nu moet de centercolumn nog op zijn plaats.
Werkt tot op zekere hoogte, ik upload wel wat ik nu heb.
De centercolumn wil niet naar zijn plek.

[ Voor 26% gewijzigd door Loev op 30-03-2006 14:01 ]


  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

Die vriend van je mag dan wel eens HTML gaan leren want er klopt syntactisch al geen hout van ;)

[ Voor 5% gewijzigd door crisp op 30-03-2006 14:15 ]

Intentionally left blank


  • Loev
  • Registratie: Augustus 2001
  • Laatst online: 05-02 11:54
http://www.dkvtoernooi.nl/index1.htm <-- dat is wat ik nu heb.
De sponsor (countdown) div zit nu op de goeie plek alleen de centercolumn wil nog niet helemaal mee werken. Iemand een ideeetje?

  • Valor
  • Registratie: Mei 2005
  • Laatst online: 06-02 08:25

Valor

yummie spam

Zal er ff naar kijken!!!

Snap niet wat er zo moeilijk aan was! Je had bijna alles al in je CSS file zitten om het zo te krijgen als je wil. Zal de boel ff goed neer zetten en dan hier posten

[ Voor 78% gewijzigd door Valor op 02-04-2006 15:18 ]


  • Valor
  • Registratie: Mei 2005
  • Laatst online: 06-02 08:25

Valor

yummie spam

Je had in de CSS file een Leftcollumn staan alleen die gebruikte je niet terwijl je die zeker nodig had.

Zo moet je DIVjes gebruiken
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<div id="maincolumn">

    <!-- start of menu -->
    <div id="leftcolumn">
    <div id="navigatie">
        
    </div>
    <!-- end of menu -->
    <br clear="all">
    
    <!-- start of countdown -->
    <div id="countdown">
    
    </div>
    <!-- end of countdown -->
    </div>
    
    <!-- start of 'centercolumn' -->
    <div id="centercolumn">
    
    </div>
    <!-- end of 'centercolumn' -->
</div>

en

Dit is je CSS waar ik spul in heb lopen wijzigen. Maybe moet je is wat over CSS gaan lezen. Dit was echt te simpel om te fixen.
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
#maincolumn {
    position:absolute;
    top: 25px;
    left: 150px;
    width: 660px;
    background-color: #EEEEEE;
}

#centercolumn {
    position: relative;
    float: left;
    width:468px;
    margin-left:15px;
    margin-top:10px;
}

#leftcolumn {
    position: relative;
    float: left;
    width:155px;
    margin-left:10px;
    margin-top:10px;
}

#countdown {
    position: relative;
    float: left;
    width: 155px;
    margin-top:10px;
}

#navigatie {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-image:url(Images/middle.gif);
    width: 155px; 
    float: left;
}


Overdadig !!!!!!! gebruiken is echt niet nodig achter elke zin!!!!

[ Voor 26% gewijzigd door BtM909 op 03-04-2006 18:06 ]


  • Loev
  • Registratie: Augustus 2001
  • Laatst online: 05-02 11:54
* Loev leest de post van Valor... telt tot 10 om de eerste boze gedachte weg te laten eppen en post hierna een normale reply
Dank je :X

  • Valor
  • Registratie: Mei 2005
  • Laatst online: 06-02 08:25

Valor

yummie spam

DarkJedi schreef op maandag 03 april 2006 @ 01:59:
* Valor leest de post van Valor... telt tot 10 om de eerste boze gedachte weg te laten eppen en post hierna een normale reply
Dank je :X
You're welcome :9

  • Boelie-Boelie
  • Registratie: November 2004
  • Laatst online: 26-09-2020
Waarom krijgen die floats position:relative mee?

Cogito ergo dubito

Pagina: 1