• For some reason images within a page will not float to the right using WP’s default placement method. This is not a problem on posts.

    URL: https://www.johnrothra.com/cv

    The top “Download CV” button should be floating to the right using this method. It worked fine until I switched to Customizr theme. Here’s the code WordPress puts into the page automatically that has worked with other themes:

    <a href="https://www.johnrothra.com/blog/wp-content/uploads/2014/06/Rothra-John-CV-with-Academic-Philo.pdf"><img src="https://www.johnrothra.com/blog/wp-content/uploads/2014/06/DownloadCVButton-190x32.png" alt="Download CV" width="190" height="32" class="alignright size-full wp-image-3415" /></a>

    The only way to get it to float properly is to manually replace the “class” part of the HTML with a “style” designating it to float:

    <a href="https://www.johnrothra.com/blog/wp-content/uploads/2014/06/Rothra-John-CV-with-Academic-Philo.pdf"><img src="https://www.johnrothra.com/blog/wp-content/uploads/2014/06/DownloadCVButton-190x32.png" style="border:none;" alt="Download CV" width="190" height="32" style="float:right;" /></a>

    It seems that to insert the image and have it work the way it should is to manually code the float because WP’s default system isn’t working.

    What do I do?

Viewing 5 replies - 1 through 5 (of 5 total)
  • I achieved it by adding id="jrcv" to the img tag and then styling with
    #jrcv {float:right;}

    or using Bootstrap, added pull-right to the class on the img tag

    Thread Starter jrothra

    (@jrothra)

    I’m not exactly sure what “using Bootstrap” means — I’ve never heard of it, nor am I a coder (just know a little HTML and CSS).

    Whether I’m adding style="float:right;" to the html or adding a new ID to it, I’m having to manually do something that should be done automatically by WordPress. So your solution results in the standard six of one, half a dozen of the other. I’m hoping I can just do what I was always able to do: in WP’s dashboard, clicking “Add media,” pick the image, choose right or left from the pulldown menu, and viola, it’s floating like it always has.

    Furthermore, this doesn’t really address why this is a problem on pages and not posts.

    I get your point. I just tried to add an image using your technique in Czr and it worked fine. So not sure what is different in your configuration. Usually comes down to a conflicting plugin impacting on the base CSS. If you have the need to prove it, try disabling all your plugins and trying again. (My first guess would be Jetpack)

    Czr is based on Twitter Bootstrap 2. When you have a few minutes, well worth a browse as it will show you how to improve your HTML/CSS.

    Thread Starter jrothra

    (@jrothra)

    It’s odd because it works fine in posts (cf. https://www.johnrothra.com/adults-big-toddlers/) but not pages (www.johnrothra.com/cv).

    My test was in Pages and it worked OK, so don’t think it’s a Czr issue

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Image in Page Will Not Float Right’ is closed to new replies.