CODEWITHSUNDEEP
csswordpresshtmlcentering
redf150flames
redf150flames

Reputation: 21

Div not Centering in WordPress

I'm trying to get a div to be centered on the page. however WordPress isn't cooperating and doing it like it does in my testing HTML document. Any ideas?

HTML

<div class="propreq grid_4"><h2>Request a Proposal</h2></div>

CSS

.propreq {
    margin: 0 auto;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 10px;
    background-color: #0e7bd0;
}

Upvotes: 0

Views: 1109

Answers (2)

Serlite
Serlite

Reputation: 12258

Looks like it's because of a couple things. Try adding the styles below to your current definition (or changing them, if they're already there):

.propreq {
    display: block;
    float: none;
}

Before, .propreq had display:inline, float:left applied to it, making the styles you were applying to it ineffective. I hope this gives you what you were looking for! If not, let me know and I'll be happy to help further. Good luck!

Upvotes: 2

Black0CodeR
Black0CodeR

Reputation: 787

There could be Several reasons.

1st: Try examining the CSS using Developer's Tools (in Chrome/FireFox). There could be another CSS rule which is OVER-RIDING your this one.

2nd: Try using

<div align="center" class="propreq grid_4"><h2>Request a Proposal</h2></div>

My best guess is, Another CSS-Rule is overtaking the Center Property.

.propreq {
margin: 0 auto;
text-align: center;
padding-top: 20px;
padding-bottom: 10px;
background-color: #0e7bd0;
}

TIP: Do a quick search on "Examining using FireFox Developer Tools" | Check out for the text-align: center; in .propreq section.

Upvotes: 0

Related Questions