Posted by Fister on 01/03/08 19:27
I'd like for the div.something-else below the three columns to be placed
25 pixels below the coloumn with the longest text. Unfortunately with the
code below it only relates to the center-column. That causes problems if
the text in left- or right-column are long. How can I fix this?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Column</title>
<style type="text/css">
#page
{
width: 620px;
}
#left-column
{
border: 1px solid #000000;
float: left;
width: 200px;
}
#right-column
{
border: 1px solid #000000;
float: right;
width: 200px;
}
#center-column
{
border: 1px solid #000000;
margin: 0 210px 0 210px;
}
#something-else
{
border: 1px solid #000000;
margin-top: 25px;
}
</style>
</head>
<body>
<div id="page">
<div id="column-container">
<div id="left-column">
<span class="text">left left left left left left left left left left
left left left left left left left left left left left left left left left
left left left left left left left left left left left left left left left</span>
</div>
<div id="right-column">
<span class="text">right right right right right right right right right
right</span>
</div>
<div id="center-column">
<span class="text">center center center center center center center
center center center</span>
</div>
</div>
<div id="something-else">
something else something else something else
</div>
</div>
</body>
</html>
Navigation:
[Reply to this message]
|