Image Centering/Line Spacing Issues with SilveRay Theme

  • agfreesafety

    (@agfreesafety)


    12 years, 11 months ago

    I recently installed the SilverRay theme to my site. I’m now noticing that the images are appearing left-aligned, even though they show up as centered in the WordPress post editor at the time of creation.

    Here’s one my post’s that you can check out as an example post of what I’m talking about.

    I’m noticing that if I select the image, then click the left or right-align button, the image moves to the appropriate side, however the text below it in the post editor wraps the image. I don’t believe the right and left-align buttons were meant to work this way, are they?

    I was actually trying to find a way to get text to wrap-around images before with another theme, so I tried to embrace this functionality for the time being in this post, but once I save the draft and preview the post, it removes spaces in the text.

    For example, initially, from within the post editor, near the top of the post, there’s a line space between the words “perseverance” and “The path”, but when I save the draft and preview the post, the line space is removed.

    Any idea how I can fix these two issues?

    Thanks in advance for your help!

Viewing 15 replies - 1 through 15 (of 16 total)
1 2
  • esmi

    (@esmi)

    12 years, 11 months ago

    I don’t believe the right and left-align buttons were meant to work this way, are they?

    Yes. The images are usually left or right floated with the text wrapping around them.

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    Thanks for that feedback.

    Any idea on the image-centering issue, or the reason why the spaces (carriage returns) are being removed?

    esmi

    (@esmi)

    12 years, 11 months ago

    Chose “Centre” for the alignment when inserting images. I can’t see the example you referred to in your second question.

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    I chose Center for the alignment for this post, but it’s still aligning the image to the left of the margin. The post is in preview mode. If you’re not able to access it still, I will publish it and update this post. Thanks so much!

    esmi

    (@esmi)

    12 years, 11 months ago

    Error 404 – Not Found

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    OK, I just published it, so you should now be able to access the post. Thanks!

    esmi

    (@esmi)

    12 years, 11 months ago

    Try adding:

    .aligncenter, .entry img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignleft, .entry img.alignleft {
	float: left;
}
.alignright, .entry img.alignright {
	float: right;
}

    to the bottom of your theme’s stylesheet

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    Hi Esmi,

    My stylesheet now reads,

    /*
Title:		screen styles and ie/win fixes
Author: 	www.blogperfume.com
*/

/* import stylesheets and hide from ie/mac \*/
@import url("master.css");
@import url("ie.css");
/* end import/hide */

.aligncenter, .entry img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignleft, .entry img.alignleft {
	float: left;
}
.alignright, .entry img.alignright {
	float: right;
}

    But the images still won’t center. Did I add that code incorrectly?

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    This is another one of my posts that the image shows up as centered in the post editor, but not when you visit the site. I just refreshed the browser after adding the code above.

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    As I reanalyzed the post I just referenced above, I wonder if the “retweet” box on the right of the center margin is what’s keeping the image at the top of the post from centering properly. I just noticed that the image embedded in the middle of the text (down into the meat of the post) is centering, it’s just the one at the top that’s not.

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    OK. I think I see what’s going on, here. Images that have the WordPress caption box on them won’t center. The ones that don’t have the caption box attached are centering. So it looks like your fix is working, just not for images with the caption boxes attached.

    Is there a way to correct this? If not, I think I can live with it, but I’d like to correct this if it’s at all possible.

    esmi

    (@esmi)

    12 years, 11 months ago

    Try adding:

    #maincol dl.wp-caption.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    My stylesheet now reads:

    [CSS moderated as per the Forum Rules. Please just post a link to your site.]

    …and the images that WordPress image captions still aren’t centering. Thanks for the feedback, esmi.

    esmi

    (@esmi)

    12 years, 11 months ago

    It looks fine to me. Remember to press CTRL and F5 simultaneously when viewing an updated page/site. Or try emptying your browser cache. This should ensure that your web browser fetches a fresh copy of the page rather than serving up an out-dated copy from your own cache.

    Also disable/deactivate any caching plugin(s).

    Thread Starter agfreesafety

    (@agfreesafety)

    12 years, 11 months ago

    I purged the IE cache, and the image with the WordPress image caption on this post still isn’t centered, while the image in this post is now centered.

    are you getting different results than I am?

Viewing 15 replies - 1 through 15 (of 16 total)
1 2
  • The topic ‘Image Centering/Line Spacing Issues with SilveRay Theme’ is closed to new replies.