4 replies [Last post]
inzain
inzain's picture
Offline
newbie
Los Angeles
Last seen: 11 years 39 weeks ago
Los Angeles
Timezone: GMT-8
Joined: 2004-08-18
Posts: 10
Points: 2

hi, i am beginning to understand CSS, but also it is beginning to confuse me very much with cross browser stability.

i am using the following code to center align this image and also have no margin at top. works fine in IE, but why not in FireFox or Netscape. why is there a margin gap for Mozilla browsers?

<style type="text/css">
body {
	margin:0px;
	padding:0px;
	text-align:center;
	background-color: #000033;
	}
</style>

here is the link

please help! thanx.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 6 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

CSS margin issue, please help

Hi inzain,
You have the image in a paragraph so you need to remove any top margin from that.
The correct way to center an element is to use margin-left:auto; and margin-right:auto; but you will need to leave in the text-align: center for IE.

Hope that helps

inzain
inzain's picture
Offline
newbie
Los Angeles
Last seen: 11 years 39 weeks ago
Los Angeles
Timezone: GMT-8
Joined: 2004-08-18
Posts: 10
Points: 2

CSS margin issue, please help

Tony wrote:
The correct way to center an element is to use margin-left:auto; and margin-right:auto; but you will need to leave in the text-align: center for IE.

Hey thanx Tony, i took your advice and took the img out of the p and placed it inside a div element instead.

is that how you would go about placing a list of images, one by one, by placing them in their own div tags?

by placing the img in the div now it works the same in FF and IE.
so if you dont mind, can you please explain what you mean by margin-left:auto; margin-right:auto; , do i add that in the css body selector?

thanx,
~Z

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 6 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

CSS margin issue, please help

Hi inzain,
Margin-left and margin-right: auto; should be applied to the element to be centered.
You shouldn't need to put the image in a div.

Are you trying to place a column of images down the center of the page?

There are a number of ways you could do that, but firstly you need to think about what other content will be on the page.

inzain
inzain's picture
Offline
newbie
Los Angeles
Last seen: 11 years 39 weeks ago
Los Angeles
Timezone: GMT-8
Joined: 2004-08-18
Posts: 10
Points: 2

CSS margin issue, please help

Tony wrote:
Hi inzain,
Are you trying to place a column of images down the center of the page?

yes, that what i will eventually do, but i just though i had to put img inside another element to validate or something,

thanx for your help
~Z