Text format problem

torweb

I'm using the following to center my page to the top of the screen and also allow it to fill the screen regardless of resolution. The problem is it removes my spacing between paragraphs.

#container {
width: 100%;
margin-top: auto;
margin-bottom: auto;
}
* {
margin:0;
padding:0;
}

I'm learning the "ways of CSS" but am lost on this one.

Thanks for any pointers!

Feb 2 '08 #1

torweb

It seems to be this section:

* {
margin:0;
padding:0;
}

If I remove it, the spacing returns but I loose my page formatting

Feb 2 '08 #2

just a feeling

Welcome back,

Let me tell u what's happening
This code zeroes all the varying browser default padding/margin settings ('*' being the universal selector that's applied to all elements in the page).

If u want the spaces between paragraphs to remain, u can add this

Feb 2 '08 #3

torweb

Grand, this is making great sense...I'm starting to like this!

Thanks again!

Feb 2 '08 #4

torweb

Darn, I'm back. It seems this also stops me from using an ordered list. I can see it when building the page in Dreamweaver, however with I load the page, the ordered list format doesn't work.

Thanks!

Feb 2 '08 #5

drhowarddrfine

The purpose of the 'universal reset' (*) is that browsers sometimes have different settings for margins and padding on some elements. This keeps them all set to zero but then you must set each element to what you want. If settings margins on your <ul> squishes everything together, then you need to set some sort of margin/padding on them.

Make sure you are using a doctype to keep IE in the ballpark of modern browsers, and do your testing in Firefox or Opera so IEs bugs don't mess with you.

Without showing the markup, we're guessing at what you are doing.

Feb 2 '08 #6

torweb

Well I guess it's acceptable then to add these elemets to my sheet, which seemed to fix things in IE and Firefox. Thanks for "guiding light"

ul {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: 17px;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #333333;
text-decoration: none;
background-color: #FFFFFF;
text-indent: inherit;
list-style-position: outside;
list-style-type: square;
padding: inherit;
margin: 25px;
}

Feb 2 '08 #7

drhowarddrfine

You can eliminate these because it's not necessary to set normal settings to 'normal' or 'none'.

font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
text-indent: inherit;
padding: inherit;

Feb 3 '08 #8