Andy
Andy

Reputation: 525

Centering float left div's in the body

i have this piece of code

<body>

    <? while.. (blah blah blah){ ?>

        <div class="product">
             something
        </div>

        <? } ?>
</body>

and the css file is

.product{ width:350px; float:left; }

the problem is that body doesn´t have a width, well... actually it has, 90%, but my problem is on the different resolutions, it works perfect for me (1680px width) but when i switch to 1024 as example, the products seems to be off (aligned to the left)

is there any posibility to center those divs with a non static with on their parent container?

Upvotes: 0

Views: 2302

Answers (3)

keithjgrant
keithjgrant

Reputation: 12739

If you want multiple divs, all centered as a group, you'll have to wrap them in a parent div, then center that using margins.

Your other option would be to make them display: inline; and use text-align: center on the body to center them. (Or consider making them spans, which default to inline)

Upvotes: 3

tahdhaze09
tahdhaze09

Reputation: 2213

If you declare a width in percentage for the div, and then do margin-left:auto;, margin-right:auto;, would that be OK?

You could give the images some left and right padding and that should make your images centered.

Upvotes: 0

Pekka
Pekka

Reputation: 449425

if you turn floating off, you can use

margin-right: auto;
margin-left: auto;

Upvotes: 2

Related Questions