Gaps and top and bottom of page

El Barto · #1 (**permalink**) 02-02-05, 01:30 PM

'Ello,

I am having a problem once I have centred my web site using the CSS margin-left: auto; margin-right: auto;. Once I have done this there is a gap at the top of the page and the bottom of the page, I tried setting the margins and padding to [I]0px[/I} but it has made no difference. Can some one help me get rid of these gaps please?

This site only works in Netscape, Opera and FireFox, not IE. I don't know why it doesn't work in IE but the site I have put up is the test page to try and get rid of the gaps without having to change the original document with all of the code for the layout etc in it. The original document for some reason centres in IE as well, I haven't worked out why but all I need to have worked out is how to get rid of the gap at the top and bottom of the page.

The web site is here if you want to view it online or view the code below in this post.

Code:

<html>

<head>

	<title>Test</title>
	
	<style>
	
		div.lyrCentre
			{
				height: 730px;
				width: 800px;
				z-index: 1;
				margin-left: auto;
				margin-right: auto;
				background-color: #FF0000;
			}
	
	</style>

</head>

<body>

	<div class="lyrCentre"></div>

</body>

</html>

#2 (**permalink**) 02-02-05, 02:33 PM

? whats wrong with setting the whole background red

El Barto · #3 (**permalink**) 02-02-05, 02:43 PM

Well that red part is ment to be centred, it represents where the my web site will be located on the screen, its a 800x600 px box and is centred in all resolutions. The red is just there representing the site, I thought if I put the whole site on here it would be to much code for people to go through to find a solution to my problem so I made another page thats the same, just instead of all teh content has a red box thats 800x600 and centred. I just want to get rid of the gap at the top and bottom of the box.

#4 (**permalink**) 02-02-05, 06:43 PM

Someone correct me if i'm wrong, i do not think u can remove the gap due to pre programmed marings or they might be the local computers page setup

Acecool · #5 (**permalink**) 02-02-05, 06:49 PM

margin-top
margin-bottom

or just use margin which sets for all

El Barto · #6 (**permalink**) 02-02-05, 06:53 PM

Quote:

Originally Posted by Acecool

margin-top
margin-bottom

or just use margin which sets for all

I tried that before but it doesn't work

.

and I hope your wrong koncept, but I think you could be right

.

Acecool · #7 (**permalink**) 02-02-05, 08:47 PM

margin: 0;
removes top, bottom, left and right

#8 (**permalink**) 02-02-05, 08:53 PM

didnt know that, thanks for the info ace

Acecool · #9 (**permalink**) 02-02-05, 10:16 PM

Np, view also source:

/* vBulletin 3 CSS For Style 'ProgrammingTalk' (styleid: 11) */
body
{
background-color: #D9D5E5;
color: #000000;
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
margin: 0px 0px 0px 0px;
}

Guess it works like that too?? 0px 0px 0px 0px

El Barto · #10 (**permalink**) 02-03-05, 11:20 AM

Yeah I know about the margin stuff but that doesn't get rid of the gaps, nor do the padding ones, I don't think tis to d owith them as they don't appear to work

.

Any mroe ideas?