Zetje in de goeie richting nodig...
Ik heb daarstraks even php op mijn laptop geinstalleerd, en wou op de homepagina iets moois hebben.
Dus nu heb ik dit gemaakt:
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
49
50
51
52
53
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
49
50
51
52
53
<!-- CSS -->
#main {
border:2px solid black;
width:1000px;
}
#mainmenuheaderleft {
background-color:#c8d7e3;
width:550px;
border:1px solid black;
float:left;
}
#mainmenuheaderleft {
background-color:#c8d7e3;
width:550px;
border:1px solid black;
float:right;
}
#mainmenu {
background-color:white;
width:550px;
}
#mainmenu a {
font-size:12px;
}
<!-- HTML -->
<div id="main">
<div id="mainmenuheaderleft">
<b>Alle websites:</b><br>
<div id="mainmenu">
Content
</div>
</div>
<div id="mainmenuheaderright">
<b>Alle TLD websites:</b><br>
<div id="mainmenu">
Content
</div>
</div>
<div id="mainmenuheaderleft">
<b>Scripts</b><br>
<div id="mainmenu">
Content
</div>
</div>
<div id="mainmenuheaderright">
<b>Projecten</b><br>
<div id="mainmenu">
Content
</div>
</div>
</div>
#main {
border:2px solid black;
width:1000px;
}
#mainmenuheaderleft {
background-color:#c8d7e3;
width:550px;
border:1px solid black;
float:left;
}
#mainmenuheaderleft {
background-color:#c8d7e3;
width:550px;
border:1px solid black;
float:right;
}
#mainmenu {
background-color:white;
width:550px;
}
#mainmenu a {
font-size:12px;
}
<!-- HTML -->
<div id="main">
<div id="mainmenuheaderleft">
<b>Alle websites:</b><br>
<div id="mainmenu">
Content
</div>
</div>
<div id="mainmenuheaderright">
<b>Alle TLD websites:</b><br>
<div id="mainmenu">
Content
</div>
</div>
<div id="mainmenuheaderleft">
<b>Scripts</b><br>
<div id="mainmenu">
Content
</div>
</div>
<div id="mainmenuheaderright">
<b>Projecten</b><br>
<div id="mainmenu">
Content
</div>
</div>
</div>
Alleen loopt dit fout.
Wat ik dus wil:
Kunnen jullie me opweg helpen?
bvd
Dalando
Edit:
Ben er uiteindelijk na veel gedoe achter gekomen, met deze css;
Ben er uiteindelijk na veel gedoe achter gekomen, met deze css;
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
#mainmenuheaderleft {
background-color:#c8d7e3;
width:350px;
border:1px solid black;
float:left;
}
#mainmenuheaderright {
background-color:#c8d7e3;
width:350px;
border:1px solid black;
float:right;
}
#mainmenu {
background-color:white;
width:350px;
}
background-color:#c8d7e3;
width:350px;
border:1px solid black;
float:left;
}
#mainmenuheaderright {
background-color:#c8d7e3;
width:350px;
border:1px solid black;
float:right;
}
#mainmenu {
background-color:white;
width:350px;
}
Edit 2:HEEELP nu voeg ik deze 2 lijntjes toe aan de code voor mijn links daarbinnenin,
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
a {
color:#000000;
text-decoration:none;
/*nieuwe lijntjes hieronder*/
margin-left:10px;
display:block;
}
color:#000000;
text-decoration:none;
/*nieuwe lijntjes hieronder*/
margin-left:10px;
display:block;
}
en nu doet ie dit:
Hoe los ik dit op???
Gewijzigd op 08/09/2010 20:59:01 door Dalando De Zuil
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
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
<div class="header">
</div>
<div class="wrapper">
<!-- De linkerkolom -->
<div class="left">
<span class="titel">Tekstkop 1</span>
<div class="box"></div>
<span class="titel">Tekstkop 2</span>
<div class="box"></div>
</div>
<!-- Het content -->
<div class="middle">
</div>
<!-- De rechterkolom -->
<div class="right">
<span class="titel">Tekstkop 3</span>
<div class="box"></div>
<span class="titel">Tekstkop 4</span>
<div class="box"></div>
</div>
</div>
</div>
<div class="wrapper">
<!-- De linkerkolom -->
<div class="left">
<span class="titel">Tekstkop 1</span>
<div class="box"></div>
<span class="titel">Tekstkop 2</span>
<div class="box"></div>
</div>
<!-- Het content -->
<div class="middle">
</div>
<!-- De rechterkolom -->
<div class="right">
<span class="titel">Tekstkop 3</span>
<div class="box"></div>
<span class="titel">Tekstkop 4</span>
<div class="box"></div>
</div>
</div>
Geef dan gewoon alles een vaste breedte, en dan left links floaten, middle ook links en right kan links of rechts gefloat worden als je je margins en widths goed doet maakt dit niks uit.
Gewijzigd op 09/09/2010 08:08:46 door Milo S
Dalando De Zuil op 08/09/2010 21:54:46:
Dat met de widths enzo lukt me wel, maar alleen margins is nog onbekend voor mij, kun je een voorbeeldstukje voor links geven? Dan lukt de rest me zelf denk ik wel ;-)
De (zeer onbekende) website "Google" heeft erg veel informatie over "margins"!
Gewijzigd op 08/09/2010 22:05:37 door niek s
Beter geef je zelf een stukje code die je op mijn html hebt gemaakt dan geven wij je wel aanpassingen en tips door...
Edit:
Je bent een mazzelaar dat ik nu niks te doen heb...
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
49
50
51
52
53
54
55
56
57
58
59
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
49
50
51
52
53
54
55
56
57
58
59
body {
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
margin: 0px;
padding: 0px;
text-align: center;
}
div.wrapper {
width: 898px;
min-height: 200px;
margin: 0px auto;
text-align: left;
border: 1px solid #000000;
}
div.header {
width: 100%;
height: 200px;
margin-bottom: 20px;
background-color: #09F;
}
div.left {
width: 199px;
float: left;
}
div.right {
width: 199px;
float: left;
}
span.titel {
width: 194px;
height: 25px;
line-height: 25px;
display: block;
float: left;
padding-left: 5px;
background-color: #09F;
}
div.box {
width: 199px;
min-height: 50px;
float: left;
overflow: hidden;
}
div.middle {
width: 490px;
float: left;
padding: 5px;
}
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
margin: 0px;
padding: 0px;
text-align: center;
}
div.wrapper {
width: 898px;
min-height: 200px;
margin: 0px auto;
text-align: left;
border: 1px solid #000000;
}
div.header {
width: 100%;
height: 200px;
margin-bottom: 20px;
background-color: #09F;
}
div.left {
width: 199px;
float: left;
}
div.right {
width: 199px;
float: left;
}
span.titel {
width: 194px;
height: 25px;
line-height: 25px;
display: block;
float: left;
padding-left: 5px;
background-color: #09F;
}
div.box {
width: 199px;
min-height: 50px;
float: left;
overflow: hidden;
}
div.middle {
width: 490px;
float: left;
padding: 5px;
}
Op 1 voorwaarde natuurlijk :D, dat je altijd als je een kolom probleem hebt je naar dit topic gaat kijken en hieruit je code vist.
Gewijzigd op 09/09/2010 08:14:56 door Milo S
Milo S op 08/09/2010 22:15:12:
Op 1 voorwaarde natuurlijk :D, dat je altijd als je een kolom probleem hebt je naar dit topic gaat kijken en hieruit je code vist.
Milo S op 08/09/2010 22:15:12:
Margin is simpel gezegd gewoon ruimte buiten bijvoorbeeld een div, padding is voor ruimte binnen bijvoorbeeld die div.
Beter geef je zelf een stukje code die je op mijn html hebt gemaakt dan geven wij je wel aanpassingen en tips door...
Edit:
Je bent een mazzelaar dat ik nu niks te doen heb...
[...]
Op 1 voorwaarde natuurlijk :D, dat je altijd als je een kolom probleem hebt je naar dit topic gaat kijken en hieruit je code vist.
Beter geef je zelf een stukje code die je op mijn html hebt gemaakt dan geven wij je wel aanpassingen en tips door...
Edit:
Je bent een mazzelaar dat ik nu niks te doen heb...
[...]
Op 1 voorwaarde natuurlijk :D, dat je altijd als je een kolom probleem hebt je naar dit topic gaat kijken en hieruit je code vist.
Bedankt, zal ik me zeker aan houden!