one div contain 2 divs one div have fix height how to?

[Amzul]

hello all,

i don't really good in css and i can't seem to figure this one

i have a div that hold inside it 2 divs

[CODE=html]<div class="line">
<div class="left"><s pan class="link">My name</span>here we have a lot of text </div>
<div class="right">t ime stamp</div>
</div>[/CODE]
css:
[CODE=css].line{width:400 px;}
.left{float:lef t;}
.right{float:ri ght;}
.link{color:blu e}[/CODE]

the problem is when the text is tooo long the left div height getting 'bigger' thats good. but the timestamp ends up at the bottom of the right div and not at the top.

what should i do?

[drhowarddrfine]

Give the "left" div a width.

[Amzul]

yeah that's no good.
the width is dynamically changing.

what i did and it solve it was to write
<div class="right">t ime stamp</div>
before
<div class="left"><s pan class="link">My name</span>here we have a lot of text </div>

thanks :)

[drhowarddrfine]

If it was changing dynamically, you could have used a percentage width. The main problem was the left div was occupying the space of the right one which was causing it to drop down, as it should.

[clai83]

Amzul,

There are many solutions to your issue, and it really depends on how technical you want to get. I don't have the all the information, but I will make a couple of assumptions.

1) You want a 2 column layout, a column on the left, and on the right.
2) You want to keep the width of <div class="line"></div> 400px wide.
3) You don't want to change your html, only css.

One Possible Solution

Set the width of <div class="left"> and <div class="right"> to something fixed. For example

   .line{width:400px;}
   .left{float:left; width: 300px;}
   .right{float:right; width: 100px;}
   .link{color:blue}

This is a simple solution and gives you the desired effect. Change the width of the .left and .right as necessary to accomodate for how you want it to look.

If you want a better answer please provide more details

Good Luck,