CODEWITHSUNDEEP
htmlcss
markzzz
markzzz

Reputation: 47945

Resizing and centering an image using CSS

My scenario:

I have resized the image using the following CSS:

max-width:300px;
max-height:300px;

The height will be kept in proportion, so in this example it will be 252 px.

How can I center the image in the div? I mean something like:

background-position: center center;

Is this sort of thing possible with CSS 2?

Upvotes: 0

Views: 120

Answers (2)

Jake Toolson
Jake Toolson

Reputation: 480

To center the DIV within an element, you would set a width and margin with the left and right margins set to auto:

div { margin: 0 auto; width: 300px; }

Upvotes: 0

Dion
Dion

Reputation: 3335

You mean

background:url("test.png");
background-size: 300px auto;
background-position: center center;

?

Upvotes: 2

Related Questions