CODEWITHSUNDEEP
htmlcss
user1960246
user1960246

Reputation: 21

Div tag center in browser window using margin 0px auto

I can not get this one div container to center within the browser page horizontally...

Here is my code.

HTML

<div class="copyrightposition clearfix">
                <p class="copyright clearfix">copyright2013 Rachael 
    Stetson Design Inc.</p>
                <p class="copyright clearfix">|</p>
                <p class="copyright 
    clearfix">www.rachaelstetson.com</p>
                </div>

CSS

.copyrightposition {
position: relative;
float: left;
margin: 0px auto 0px auto;
}
.copyright {
position: relative;
float: left;
font-size: 65%;
padding-right: 10px;
text-transform: uppercase;
letter-spacing: 0.19em;
}

Upvotes: 1

Views: 960

Answers (2)

Ionică Bizău
Ionică Bizău

Reputation: 113455

I've edited your code. See this jsFiddle.

I used text-align:center.

HTML

<div class="copyrightposition clearfix">
  <p class="copyright clearfix">copyright &copy lorem ipsum |  www.rachaelstetson.com</p>
</div>

CSS

.copyrightposition {
  text-align: center;
}
.copyright {
  font-size: 65%;
  padding-right: 10px;
  text-transform: uppercase;
  letter-spacing: 0.19em;
}

Upvotes: 0

riku
riku

Reputation: 763

margin: 0 auto; only works for elements with set width and they cannot be floated.

Upvotes: 1

Related Questions