| 11:40 am on Feb 2, 2010 (gmt 0)|
Your CSS looks correct to me, for centering a page - so I'd hazard a guess that there's another issue there, either an HTML one, or cascade where the parent container is floated?
Could IE issue could be a resolution one? Maybe your screen res is different from the mac to PC screen? If so, then test the site at your base res on both platforms.
| 4:52 pm on Feb 4, 2010 (gmt 0)|
If you refresh the page after resizing the browser window, does it then go back to the centre?
It's kind of hard to tell what your issue is from the initial post - "it looked very big" is too vague to give any advice because you could mean a whole lot of things.
| 9:44 pm on Feb 10, 2010 (gmt 0)|
Thanks guys for your replies. What I did was I changed the header image width from 1200px to 1050px. it reduced the width of the page a lot and looks okay on the browsers. But I am still confused as to,
why does a width of 1200px (centered) look proper on safari and looks very wide on other browsers.
1200px on safari
| |HEADERIMAGE| |
1200px on other browsers
THE HEADER IMAGE COVERS THE WHOLE PAGE and as the width of the page is related to the header image, the whole page becomes wide.
| 9:57 am on Mar 9, 2010 (gmt 0)|
Apple monitors have different resolution to others. 96dpi Apple, 72dpi others, iirc. That might be it?
| 7:51 pm on Mar 9, 2010 (gmt 0)|
A pixel is a pixel on most any consumer platform, Mac vs. Windows is irrelevant in that regard. The resolution to which you refer is used for print approximations of screen layouts, not for the screen itself.
Have you validated your code to ensure there is no bad markup or conflicting styles? If so, I would try wrapping the header image in a block (img by default is an inline element) and styling it. It's also not clear to me why position: relative needs to be set at all.
| 8:03 pm on Mar 9, 2010 (gmt 0)|
|I tried my web page on IE, and it looked very big. |
Could it simply be that the View > Text Size is set to Larger or Largest on those machines?
| 7:01 am on Mar 14, 2010 (gmt 0)|
What size monitor do you have on your Mac. A buddy of mine has one of the giant flat screens. You know, the kind that you could open up a drive-in theater with? My online magazine, which fits my 15-inch flat screen, looks absolutely puny on his.
Could this be what you're seeing? Are you building on a large monitor?
| 4:50 pm on May 20, 2010 (gmt 0)|
I am not sure what the problem was. I am still trying to find out the reasons it happened. But what I did was-
My header image was 1300px wide (which i thought might have caused the complete container and the page to blow out of proportion.)
so I reduced it to 1050px. Now it looks okay.
One more thing I was doing was using div's and absolute positioning.
I changed that whole thing and created everything from scratch using tables and relative positioning.
| 6:45 pm on May 20, 2010 (gmt 0)|
In case you don't have a copy yet, I'd like to recommend David Sawyer McFarland's book, CSS: The Missing Manual. This has become a very useful reference book for me. It could answer quite a few of your questions!
| 6:50 pm on May 20, 2010 (gmt 0)|
Thanks for your response. I actually use lynda.com and learn from those tutorials. i will also buy the book you mentioned.