CODEWITHSUNDEEP
htmlcss
user2771714
user2771714

Reputation: 311

Center through CSS doesnt work

I have div in HTML, there is i Picture and a piece of text. I have all this center through margin, but it is all in left. Why? HTML:

<div class="slozka">
    <img src="http://randompics.net/gmig6jx/" alt="složka"></br>
    {{object}}
</div>

CSS:

.slozka
{
    width:125px;
    padding:0px
}
.slozka > img
{
    width: 100px;
    height: 100px;
    margin: 0 auto;
    padding:0px;
}
.slozka:hover
{
    border-style: outset;
}

Upvotes: 1

Views: 62

Answers (4)

UID
UID

Reputation: 4514

You just need to provide "text-align: center;" to ".slozka{...}" class

Upvotes: 0

Vinay Pratap Singh Bhadauria
Vinay Pratap Singh Bhadauria

Reputation: 9947

use this
.slozka { text-align: center; }

Upvotes: 0

Kevin Lynch
Kevin Lynch

Reputation: 24703

You may need to center .slozka also.

.slozka
{
    width:125px;
    padding:0px;
    margin: 0 auto;
    text-align: center;
}

Also if </br> is supposed to be a line break then it is in correct, you need <br />

Upvotes: 0

Quentin
Quentin

Reputation: 943142

Auto margins centre block elements. That image is display: inline (the default).

Set .slizka { text-align: center; } instead (this centres inline content).

Upvotes: 4

Related Questions