CSS – Gazette Theme – Sidebar
-
Hi,
I recently changed to the Gazette theme.
When clicking on one of my blogposts I noticed that there’s a fine grey line on the right of each post.
Is there any way I can remove this line with the customized CSS tool?
Also, I noticed that every first image (when clicking on one of my blogposts) is slightly more aligned to the left than any of the other images. All of the images have the same size and are centered…
I would love to hear from you!
The blog I need help with is: (visible only to logged in users)
-
Try adding the following custom CSS.
.single .widget-area { border-left: 0px solid #DDD; } .single .site-main { border-right: 0px solid #DDD; float: left; padding-right: 60px; } -
Let me chime in!
Also, I noticed that every first image (when clicking on one of my blogposts) is slightly more aligned to the left than any of the other images.
If you want to fix the alignment on the post you linked, the following code should work. However, I believe this behavior is not consistent among all the posts, for example, this one.
.entry-content .beautysets_set_wrapper:first-child{ margin-left: 70px; }This will target the first image, adjust margin as required. :)
-
Hi @ethis! Thanks for the advice!
Unfortunately the images are still a little bit more to the left…
http://makeupforwomen.be/2015/08/08/aqua-make-up-tutorial/ -
@makeupforwomen, I’ve looked at your site and when I narrow my browser window down to small tablet/phone size, half of your content disappears off the right side of the screen requiring me to scroll right in order to see it. This is due to the HTML level style attributes you have added to the post itself. We can’t override those with CSS. My suggestion would be to remove all those and then we can start from scratch and get things aligned the way you want them using CSS. Leave the
class="beautysets_set_wrapper"
in there though and we can use that class to create the CSS rule to style the images the way you want them. -
Hi @thesacredtpath, I have no idea how this works so the best thing is just to give the excisting CSS I have at this moment:
.entry-content .beautysets_set_wrapper:first-child{
margin-left: 70px;
}.single .widget-area {
border-left: 0px solid #DDD;
}.single .site-main {
border-right: 0px solid #DDD;
float: left;
padding-right: 60px;
}
.entry-footer {
display: none;
}
.entry-hero .post-thumbnail {
background: #FFFFFF none repeat scroll 0% 0% !important;
}
/* 2.4 Content */
#content {
min-height: 550px;
padding: 0;
}I just noticed that the text on my homepage is overflowing the images and other text…don’t know how on earth this happened:(
-
Hi, When I look at one of your actual posts in the post editor, what I am seeing is this div that surrounds the content (I’m looking at the Soaking on Monday! post).
<div style="margin:0 auto;padding:8px;border:0;width:660px;" class="beautysets_set_wrapper">
Notice the width style attribute you have in that? That is forcing the content to stay at 660px. That style attribute you have added is HTML level styling and it cannot be overwritten with CSS.Did you add that yourself, or did you perhaps copy/paste from another website?
-
Hi @thesacredpath, well I always copy paste the layout of the previous article when I write a new blog post. I’ve been doing this for a very long time because I used to have trouble with the new articles having a different layout than the previous ones. Is this what’s causing the text on my home page to change position as well?
-
What I would suggest would be to make a draft post off of one of your posts and then remove the
width: 660px;
from the opening div tag and save it as a draft. You would then copy that post for new posts.The above would fix things for future posts, but any existing posts that have that should probably be edited and have it removed. so that they will fit correctly for smaller devices.
-
-
- The topic ‘CSS – Gazette Theme – Sidebar’ is closed to new replies.
WordPress.com Forums 