making box width variable

[baabu]

im making a box using <div> tags..
the height of the box i have made fixed, but i want to make the width variable and i want to make it so when i resize the browser window, the width of that box changes so that it stays 50pixels from the right side of the browser window

any ideas how to do this please??

Thanks

 

[kaht]

Just use a margin to keep it off the right edge:

<style type="text/css">

div {
   [!]margin-right:50px;[/!]
   height:200px;
   border:1px solid black;
}

</style>

<div></div>

-kaht

How much you wanna make a bet I can throw a football over them mountains?

 

[baabu]

oh ye thanks..
but how do i make the width variable??

 

[baabu]

and i want the width to change when browser is resized so it stays at 50pixels from right?

 

[kaht]

The width is variable. Copy/paste that into a new .html file and resize your browser. You'll see that the size of the box changes.

-kaht

How much you wanna make a bet I can throw a football over them mountains?

 

[kaht]

AND it stays 50px from the right. If your question involves more conditions then perhaps you should state what they should be. The example I posted does exactly what you asked.

-kaht

How much you wanna make a bet I can throw a football over them mountains?

 

[baabu]

Yea sorry...the code you provided works thanks...but it dusnt work with mine..here is my code:

<style type="text/css">

div.myBox
{
margin-right:50;
position:absolute;
height:200;
left:100;
top:100;
border:1 solid red;
}

</style>

<div class="myBox"></div>

That doesnt work..any ideas why not??

 

[kaht]

Because you're using position absolute. It takes the element out of the normal page flow and doesn't work by the same rules as regularly flowing elements. If you want that element to start at position 100x100 then maybe you can try something like this:

<style type="text/css">

div.myBox {
   [!]margin:100px 50px 0px 100px;[/!]
   height:200;
   border:1 solid red;
}

</style>

<div class="myBox"></div>

-kaht

How much you wanna make a bet I can throw a football over them mountains?

 

[Vragabond]

And don't make our poor kaht post code without units because he is copying your code. Always include units in all your values in css except for:

a) when values are 0;
b) when specifying line-height, units can be omitted.

 

[kaht]

I should be ashamed.... I shoulda noticed that....

Kaht

-kaht

How much you wanna make a bet I can throw a football over them mountains?