Hallo mensen!
Tijdens het maken van een layout liep ik tegen het volgende probleem aan.
Ik probeer op een gegeven moment een tabel rechts neer te zetten in en div element.
Natuurlijk heb ik 'float: right;' al geprobeerd, deze doet maar half wat ik wil. De tabel komt weliswaar rechts in de div te staan, maar de divs die eronder staan schuiven daarbij meteen een stukje naar boven.
Ze overlappen de div met de tabel dan, dat was niet de bedoeling.
Hoe kan ik dus zorgen dat de layout hetzelfde blijft, maar de tabel wel rechts staat?
Bijvoorbaat dank!
Hieronder screenshots en code voor extra duidelijkheid.
Als de tabel links staat:
Code:
Met 'float: right;' (en de lay-out raar gaat doen):
Code:
Tijdens het maken van een layout liep ik tegen het volgende probleem aan.
Ik probeer op een gegeven moment een tabel rechts neer te zetten in en div element.
Natuurlijk heb ik 'float: right;' al geprobeerd, deze doet maar half wat ik wil. De tabel komt weliswaar rechts in de div te staan, maar de divs die eronder staan schuiven daarbij meteen een stukje naar boven.
Ze overlappen de div met de tabel dan, dat was niet de bedoeling.
Hoe kan ik dus zorgen dat de layout hetzelfde blijft, maar de tabel wel rechts staat?
Bijvoorbaat dank!
Hieronder screenshots en code voor extra duidelijkheid.
Als de tabel links staat:
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
background: #666666;
padding-top: 7px;
text-align: center;
}
div {
border: 1px dotted #000000;
}
#container {
width: 1000px;
text-align: left;
margin: 0 auto;
}
#nav {
}
#content {
width: 80%;
}
#sidebar1 {
float: right;
width: 20%;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
head
</div>
<div id="nav">
<table>
<tr>
<td width="200">linkbar moet rechts staan</td>
</tr>
</table>
</div>
<div id="sidebar1">
side
</div>
<div id="content">
content
</div>
<div id="footer">
foot
</div>
</div>
</body>
</html> |
Met 'float: right;' (en de lay-out raar gaat doen):
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
background: #666666;
padding-top: 7px;
text-align: center;
}
div {
border: 1px dotted #000000;
}
#container {
width: 1000px;
text-align: left;
margin: 0 auto;
}
#nav {
float: right;
}
#content {
width: 80%;
}
#sidebar1 {
float: right;
width: 20%;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
head
</div>
<div id="nav">
<table>
<tr>
<td width="200">linkbar moet rechts staan</td>
</tr>
</table>
</div>
<div id="sidebar1">
side
</div>
<div id="content">
content
</div>
<div id="footer">
foot
</div>
</div>
</body>
</html> |
:strip_exif()/u/27216/bosmonster_dropdown.gif?f=community)
