Gecentreerde DIV probleem
Ik ben bezig met mijn eerste DIV layout. Echter lukt het me nog niet om de gecentreerde box op de juiste margin te krijgen.
leftnav, rightnav en content hebben alledrie een top-margin van 10px. Echter doet de content vreemd. Weet iemand hoe dit komt?
De pagina's zijn hier te vinden:
HTML: www.pennyprojects.nl/philart/index.php
CSS: www.pennyprojects.nl/philart/scripts/default.css
Dank!
Gewijzigd op 01/01/1970 01:00:00 door Zelf Weten
Welliswaar geen 24 uur later, maar wel een klein 12 uur en deze post is bij thuiskomst om rondom 6 uur gepost. SanThe, ik wacht op je standaard NIET BUMPEN reactie, maar zou niet zo sympathiek zijn!
-x-
Probeer ze eens alle drie naar links te floaten.
HTML: www.pennyprojects.nl/philart/index.php
CSS: www.pennyprojects.nl/philart/scripts/default.css
Thnx Jonathan, we zijn er volgens mij bijna!
Zelf Weten schreef op 18.04.2008 05:52:
*bump*
Welliswaar geen 24 uur later, maar wel een klein 12 uur en deze post is bij thuiskomst om rondom 6 uur gepost. SanThe, ik wacht op je standaard NIET BUMPEN reactie, maar zou niet zo sympathiek zijn!
-x-
Welliswaar geen 24 uur later, maar wel een klein 12 uur en deze post is bij thuiskomst om rondom 6 uur gepost. SanThe, ik wacht op je standaard NIET BUMPEN reactie, maar zou niet zo sympathiek zijn!
-x-
Dat doet SanThe niet om onsympathiek te zijn, maar omdat dat nu eenmaal de regels zijn. Anders werkt iedereen steeds zijn/ haar topic weer omhoog en dat willen we niet.
Als je weet dat het niet mag (en dat geef je toch wel duidelijk aan!) doe het dan gewoon niet, je lokt nu zelfs een reactie uit.
}
#container {
width: 600px;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
}
#header {
height: 90px;
}
#menu {
float: left;
width: 140px;
}
#content {
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
overflow: auto;
}
html div gedeeldte :
<div id="container">
<div id="header"></div>
<div id="menu"></div>
<div id="content"></div>
</div>
Indien je nu nog een extra div wil hebben aan de rechtkant dan zet je die even onder het menu <div id=rechtsmenu> </div>
extra css
#rechtsmenu {
float: right;
width: 140px;
}
Succes
Gewijzigd op 01/01/1970 01:00:00 door Bart Smulders
Robert_Deiman schreef op 18.04.2008 07:23:
Dat doet SanThe niet om onsympathiek te zijn, maar omdat dat nu eenmaal de regels zijn. Anders werkt iedereen steeds zijn/ haar topic weer omhoog en dat willen we niet.
Als je weet dat het niet mag (en dat geef je toch wel duidelijk aan!) doe het dan gewoon niet, je lokt nu zelfs een reactie uit.
Zelf Weten schreef op 18.04.2008 05:52:
*bump*
Welliswaar geen 24 uur later, maar wel een klein 12 uur en deze post is bij thuiskomst om rondom 6 uur gepost. SanThe, ik wacht op je standaard NIET BUMPEN reactie, maar zou niet zo sympathiek zijn!
-x-
Welliswaar geen 24 uur later, maar wel een klein 12 uur en deze post is bij thuiskomst om rondom 6 uur gepost. SanThe, ik wacht op je standaard NIET BUMPEN reactie, maar zou niet zo sympathiek zijn!
-x-
Dat doet SanThe niet om onsympathiek te zijn, maar omdat dat nu eenmaal de regels zijn. Anders werkt iedereen steeds zijn/ haar topic weer omhoog en dat willen we niet.
Als je weet dat het niet mag (en dat geef je toch wel duidelijk aan!) doe het dan gewoon niet, je lokt nu zelfs een reactie uit.
Mee eens. Volgende bump == topic closed, wat mij betreft.
Echter Bart, ik heb het geprobeerd. Maar ik zie / snap niet zo goed wat hier anders aan is dan wat ik zelf heb. Behalve dan die overflow. Wat moet ik wijzigen als je kijkt naar mijn stuk CSS? Dus dan bedoel ik dit stuk:
Code (php)
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
46
47
48
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
46
47
48
#outer {
width: 1000px;
margin: 0px auto;
background-color: #fff;
color: #333;
line-height: 130%;
}
#inner {
width: 980px;
padding-top: 10px;
margin: 10px auto;
}
#header {
padding: .5em;
background-color: #ddd;
height: 120px;
border-bottom: 1px solid gray;
}
#leftnav {
float: left;
background: #C0C0C0;
width: 160px;
padding: 1em;
margin: 0 0 15px 0;
}
#rightnav {
float: right;
background: #C0C0C0;
width: 160px;
padding: 1em;
margin: 0 0 15px 0;
}
#content {
float: left;
overflow: auto;
position: absolute;
width: 200px;
background: #909090;
padding: 1em;
margin: 0px 200px 15px 200px;
border-left: 1px solid gray;
border-right: 1px solid gray;
}
width: 1000px;
margin: 0px auto;
background-color: #fff;
color: #333;
line-height: 130%;
}
#inner {
width: 980px;
padding-top: 10px;
margin: 10px auto;
}
#header {
padding: .5em;
background-color: #ddd;
height: 120px;
border-bottom: 1px solid gray;
}
#leftnav {
float: left;
background: #C0C0C0;
width: 160px;
padding: 1em;
margin: 0 0 15px 0;
}
#rightnav {
float: right;
background: #C0C0C0;
width: 160px;
padding: 1em;
margin: 0 0 15px 0;
}
#content {
float: left;
overflow: auto;
position: absolute;
width: 200px;
background: #909090;
padding: 1em;
margin: 0px 200px 15px 200px;
border-left: 1px solid gray;
border-right: 1px solid gray;
}
Als ik dit doe:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
#content {
float: left;
background: #909090;
padding: 1em;
margin: 0px 200px 0px 200px;
border-left: 1px solid gray;
border-right: 1px solid gray;
}
float: left;
background: #909090;
padding: 1em;
margin: 0px 200px 0px 200px;
border-left: 1px solid gray;
border-right: 1px solid gray;
}
Staat hij goed in het midden, maar is hij niet breed genoeg. Als ik dan dus vervolgens een width: wil toevoegen komt hij eronder te staan. Dit dus bijvoorbeeld:
Bumpen::
SanThe.
DANK!
p.s. slotje mag erop!