CODEWITHSUNDEEP
htmlcssmobileposition
Trent Scott
Trent Scott

Reputation: 2028

Properly Centering an Image (Margin Auto?)

I need to center a logo above a content box, with center alignment.

At present, I use the following code:

#logo img {
margin: -12em 0 4em 17em;
}

Although this works on computers, it breaks on mobile phones. See screenshot.

How can I get the functionality I desire on both platforms? I tried margin: 0px auto; to no avail.

URL: http://ec2-174-129-169-80.compute-1.amazonaws.com/

iPhone Preview

Upvotes: 0

Views: 113

Answers (2)

Lisa Lemons
Lisa Lemons

Reputation: 160

Remove float: left from #logo and then go to #logo img and add:

#logo img{
    margin-left: auto;
    margin-right: auto;
}

Upvotes: 0

user1454661
user1454661

Reputation:

You want the image centered? Then why is #logo set to float: left; in layout.css line 89?

Upvotes: 2

Related Questions