[SOLVED] Container Block Question

[KnottyAlder]

I'm trying to break my tables habit and start programming with div tags, but I'm experiencing some difficulty.

 

The website is: www.ble55.org

I'm having problems with the position of the quotes within the header. Here's my CSS code:

#header{

position: relative; left: 25%; width: 800; height: 130;

}

 

#quotes {

position: absolute; top: 50%; bottom: 0; left: 16%; right: 200; width: 25%; height: 3em; overflow: hidden;

font-family: "Times New Roman", Times, serif;

font-size: 14px;

color: #FFFFFF;

}

 

Shouldn't quotes be positioned absolutely within the header, because the header would bcome the quote's container block? Why doesn't the quotes stay aligned with the header when the size of the browser window changes?

 

Any help you can offer would be greatly appreciated. Thank you.

[calabiyau]

 

 

#quotes {

position: absolute; top: 50%; bottom: 0; left: 16%; right: 200; width: 25%; height: 3em; overflow: hidden;

font-family: "Times New Roman", Times, serif;

font-size: 14px;

color: #FFFFFF;

}

 

 

I'm not sure if it will solve your problem, but I dont' think you need to specify top, bottom, left, right if you want to absolutely position something.  You chose top or bottom, left or right and you should be able to position the quotes exactly where you want them. 

[KnottyAlder]

Thanks, I have the position correct on my monitor when the browser window is maximized. I'm having trouble when I'm changing the size of the browser.

[KnottyAlder]

I think I've figured it out. Here's my code, is this a good way to accomplish what I'm going for?

 

/*

=============================================================

HTML OBJECTS

=============================================================

*/

 

body {

position: relative;

background: url(../images/bg_repeat.gif) repeat-x;

}

 

/*

============================================================

HEADER OPTIONS

============================================================

*/

 

#header{

position: relative; left: 25%; width: 800; height: 130;

}

 

#quotes {

position: absolute; top: 65px; left: 275px; width: 425px; height: 4em; overflow: hidden;

font-family: "Times New Roman", Times, serif;

font-size: 14px;

color: #FFFFFF;

}

 

/*

=============================================================

BODY OBJECTS

=============================================================

*/

 

#content {

position: absolute; top: 130px; left: 0; width: 800px;

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

background: #FFFFFF;

}