Sela: left align main content and date stamp help – third time I'm reaching out!
-
Hello, I would like to align the content of my posts and pages more to the left. If you look on my site, you can see that it looks unbalanced with too much white space on the lefthand side. This is especially apparent on my pages. I have the design upgrade, I’m just not sure what code to use to fix this problem.
Also, I’d like the date of the posts to be underneath the post title, rather than on the left of the post.
If possible, I’d like to get rid of the “leave a comment” option that is currently underneath the post date.
I’d really appreciate any help with this issue!
Janyssa
The blog I need help with is: (visible only to logged in users)
-
Could you try these styles and let me know what you think:
.entry-meta { position: relative; text-align: left; } .entry-body { margin-top: -20px; } @media screen and (min-width: 1180px) { padding-left:0; } -
Hello staff-happychia, I pasted the code you suggested into the CSS customizer. It worked with making the date go above the post rather than next to it, thank you! However, I do not see any changes with the position of the main content. The home page post and my pages are still too far to the right. It’s like the margin of white space on the lefthand side is way bigger than the one on the right, making it look unbalanced. Is there a way to fix this? Thanks for your help!
-
Oops. My bad. The last style in my previous update was missing the selector.
Please remove
.entry-body { margin-top: -20px }and add
@media screen and (min-width: 1180px) { .entry-body{ margin-top: -20px; padding-left:0px; } header.entry-header { margin-left:0px; } } -
That worked great for the homepage posts! Thanks! When I click on the pages from the top menu they are still in the same spot though. Maybe that has something to do with how I formatted it in the Pages editor?
Also, would it possible to move the post title over as well? Now on my homepage the content is moved to the left (yay!) but the post title is still in the same place.
-
Update the previous CSS to the following to move the title left.
@media screen and (min-width: 1180px) { .entry-body { margin-top:-20px; padding-left: 0 } .blog .without-featured-image > .entry-header { margin-left: 0 } }Pages- I will let you know tonight New Zealand time :-)
-
-
Please remove the CSS in my previous and add the following modified style and see if you like the result:
@media screen and (min-width: 1180px) { .entry-body { margin-top:-20px; padding-left: 0 } .blog .without-featured-image > .entry-header , .single-post .without-featured-image > .entry-header { margin-left: 0 } } -
It looks the same as it did before. The homepage post is aligned more to the left where I want it, that’s perfect. The pages are still in the middle looking weird.
-
Please add these styles before the last closing curly bracket } to left align and increase the width of the page content:
.page .content-wrapper { padding-left: 0; } .page .content-wrapper .content-area { width: 820px; } -
That looks much better! One last question: I tried to change that 0 (zero) just to play around and see what would happen with the padding, but nothing changed. It only worked with a zero. Just curious. Overall I am happy with the changes you helped me with! Thank you very much!
-
If you remove the rule that is setting the left margin to 0, the right sidebar will be pushed down because the padding for the post area will be set to the theme default of 201 px.
We can set the left padding to up to 55px without pushing the sidebar down.
- The topic ‘Sela: left align main content and date stamp help – third time I'm reaching out!’ is closed to new replies.
WordPress.com Forums 