ansaurus

Question

Answer 1

+1 A:

I tried your setup, and it works just fine.

You should check the spelling and syntax of your CSS, there is probably some error that keeps it from working. In Firefox you can open up the error console and reload your page, and it will tell you about any CSS errors.

You can also use margin-left: auto; margin-right: auto; to center the element.

Here is the code of the page that I used to test the CSS:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<title>Test</title>
<style type="text/css">
div { width: 80%; margin-left: 10%; margin-right: 10%; background: #ccc; }
</style>
</head>
<body>
<div>asdf</div>
</body>
</html>

Guffa 2010-05-08 19:48:14

No errors are showing on the firebug css errors console.

2010-05-08 19:52:47

@user: I added the code that I used above.

Guffa 2010-05-08 20:43:01

Answer 2

+1 A:

try set theese:

<html>
<head>
    <style>
        .container {
            position: relative;
            margin-left: auto;
            margin-right: auto;
            width: 80%;
            background-color: red;
        }
    </style>
</head>
<body>
    <div class="container">
        Testing page
    </div>
</body>
</html>

siulamvictor 2010-05-08 19:48:58

That doesn't fix the problem either. It's the same result as setting margin left and right at 10%.

2010-05-08 19:53:14

i updated the code, and it works well. please try. :)

siulamvictor 2010-05-08 20:00:58

Thanks. It was actually a HTML problem. I had included an extra div that wasn't required.Problem solved.

2010-05-08 20:16:10

Answer 3

A:

has the parent element of the div a specified witdh?

Try

width: 100%;

for the parent Element

Michele 2010-05-08 19:56:32

I set the width of the body (the parent of the div) to 100% but it changes nothing still.

2010-05-08 20:01:32

ansaurus

tags:

views:

answers:

CSS Not Centering Container

related questions