CSS positioning queery, yawn

jo5eph's picture

They have: 24 posts

Joined: Jul 2004

Hello,

How can i get tables, divs etc to snap to the right side of the browser window, been learning css the hard way for a while and most problems with positioning have been sorted eventually. However one thing i just cant work out is how to make my page snap exactlly up to the right edge. I can get close but never exact. here is an example (where the right border has a margin). here is the css i used for the maintable

.maintable {
height: 800px;
width: 100%;
top: 0px;
position: absolute;
left: 0px;
right: 0px;
bottom: 0px;
text-align: center;
}
I can sort of get the effect i want by making width+ 103% but im sure that there is a better way.

Thanks in advance,

Joe

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

.maintable {
height: 800px;
width: 100%; /* this should have it flush to the sides unless you have padding/margins in the containing element */
text-align: center; /* this centers the text WITHIN the table, not the table */
margin: auto; /* this centers the table */
}

body {
margin: 0;
padding: 0;
}

Also, the element can ONLY go in the element.

jo5eph's picture

They have: 24 posts

Joined: Jul 2004

OK,

You had me puzzled at first because i hadnt got any margins or padding. After scratching my head for a while I redefined in css as having 0 padding and 0 margin. Of course it did the trick. Cheers, that one has been buggin me for ages (i do research the forums and google alot, just never found the answer for that one).

Also I know you are right about the internal 's needing to be in head. but when i move them there they stop working, as the site works in IE mozilla and opera ok as is, is there any reason to sort it out, other than for the sake of correctness?

Thanks Again,

Joe

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

well, yes -- for accessibility, for forwards compatibility, and for ease of editing. If they don't work in the element, you have errors in your code. Standards are important for many reasons, the LEAST of which is "being correct".

Validate.

http://validator.w3.org
http://jigsaw.w3.org/css-validator/

jo5eph's picture

They have: 24 posts

Joined: Jul 2004

Point taken,

whole site now validates html and css!

Joe

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.