Zorgen dat een Image de Div Wrapt
Ik heb nu dit: http://school.junkiexp.com/3.2/_.WiVE/front/ hopend kan iemand mij verder helpen :).
Zie hier voor live voorbeeld
Maar goed, om het voorbeeld letterlijk over te nemen:
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
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
<html>
<head>
<style type="text/css">
#main {
border:1px solid #000;
background:#fff;
}
#main #menu {
border-left:1px solid #000;
border-bottom:1px solid #000;
float:right;
width:230px;
background:#eee;
margin:0px 0px 10px 10px;
}
</style>
</head>
<body>
<div id="main">
<div id="menu">
<p>Dit hier is je image box...</p>
</div>
<p>Hier komt je main content...</p>
<p>En om te zien dat het werkt</p>
<p>Stoppen we er ook nog een paar extra regels tekst in, die zo lang zijn dat ze ook nog onder de imagebox uitkomen zodra je je scerm verkleint.</p>
</div>
</body>
</html>
<head>
<style type="text/css">
#main {
border:1px solid #000;
background:#fff;
}
#main #menu {
border-left:1px solid #000;
border-bottom:1px solid #000;
float:right;
width:230px;
background:#eee;
margin:0px 0px 10px 10px;
}
</style>
</head>
<body>
<div id="main">
<div id="menu">
<p>Dit hier is je image box...</p>
</div>
<p>Hier komt je main content...</p>
<p>En om te zien dat het werkt</p>
<p>Stoppen we er ook nog een paar extra regels tekst in, die zo lang zijn dat ze ook nog onder de imagebox uitkomen zodra je je scerm verkleint.</p>
</div>
</body>
</html>
En nu maar eens spelen met de breedte van je scherm om te zien wat er gebeurt.
Het enige wat je eigenlijk hoeft te doen is de ImageBox rechts te laten floaten, en geen float meegeven aan de content waar de Image in staat.
Gewijzigd op 01/01/1970 01:00:00 door JunkieXP
Gewijzigd op 01/01/1970 01:00:00 door Joren de Wit