3 svar · 340 visningar · startad av Jessica_s76
Ja hur gör man något liknande i css?
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
</td>
<td>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
Kladd text här<br>
</td>
</tr>
</table>
Måste man göra två divar eller kan man lösa det på något bättre sätt?
Tre divar blir bra, men det kanske bara är jag som inte kommer på en lösning med två divar just nu. :)
CSS:
#wrap { width: 600px; }
#left { float: left; width: 400px; margin: 0; padding: 0; }
#right { float: right; width: 200px; margin: 0; padding: 0; }
HTML:
<div id="wrap">
<div id="left">Vänster</div>
<div id="right">Höger</div>
</div>
#wrap är till för att hålla de andra på plats. Google-sökning
det kan passa bra med en clear: both; efter där, annars kommer det se skumt ut.
Man kan göra såhär:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="sv">
<head>
<title>Test</title>
<style type="text/css">
body { display:table; }
div { display:table-cell; width:10em; }
#left { background:yellow; }
#right { background:lime; }
</style>
</head>
<body>
<div id="left">Vänster</div>
<div id="right">Höger</div>
</body>
</html>
...fast det funkar inte med IE, så vi kan göra såhär istället:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="sv">
<head>
<title>Test</title>
<style type="text/css">
#left { float:left; width:10em; background:yellow; }
#right { margin-left:10em; width:10em; background:lime; }
</style>
</head>
<body>
<div id="left">Vänster</div>
<div id="right">Höger</div>
</body>
</html>