Center Pages in Sela Theme
-
On my about page (as an example), you can see the content is not centered.
Does anyone have CSS that will center this page?
The blog I need help with is: (visible only to logged in users)
-
-
Hi Bree
In the .content-area section of your custom CSS, try changing the width from 80% to 95% or even 100% like this:
.content-area { float: none; margin-left: auto; margin-right: auto; width: 95% !important; } -
Sorry, the look of that is really bothering me, so I’ve switched back.
When I use the content-area coding with 100%, this is what each of those pages looks like. The main page is too wide, and the about page is just right.
-
OK … let’s try this.
.content-area { float: none; margin-left: 13% !important; margin-right: 13% !important; width: 80% !important; } -
With that coding, main blog is just a little off centre. I’ll leave active for your reference.
-
-
Okay, I figured out the centering issue. However, the About page is still very narrow. Any idea why this is?
-
There seems to be a very wide margin on the left. Try this.
.content-wrapper.with-featured-image { margin: 0px; } -
-
I think this should do it :)
.content-wrapper.with-featured-image { margin: 0px !important; } -
That does center the page, but now the text doesn’t ride up slightly on the image, which in this page template, it should.
-
For some reason, since adding this CSS, the page templates are now different as well. Now they list as:
Default
Eventbrite Events
Page Plein Ecran
Page Quadrille
Page d’Accueil -
I’m not sure about the page templates. I don’t think that is caused by the CSS.
Try this to get the text to ride up a bit.
.content-wrapper.with-featured-image { margin: 0px !important; } -
-
Ah, here’s my original issue. That CSS did work to move the text up, but you’ll see the white runs off the right side of the image. Even if I get rid of all of my existing CSS and just keep the code above, this white space still appears.
Sorry to keep on with the questions, but do you know why this would be happening?
-
We need to make the area a little narrower.
.content-wrapper.with-featured-image { margin-left: 4% !important; width: 84% !important; } -
Thank you!! Worked so well!
Any chance you know how to reduce the white space between the text and the edges of the post? :)
- The topic ‘Center Pages in Sela Theme’ is closed to new replies.