Prose, right image off the screen

Community Forums Forums Design Tips and Tricks Prose, right image off the screen

This topic is: not resolved

This topic contains 6 replies, has 2 voices, and was last updated by  Pinky 1 year, 1 month ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #28329

    jmfoust
    Participant
    Post count: 10

    Hello,  Im having another problem.  I have a image that is Right Aligned, but its falling off the page.  The margin on the left is wide, and the right is acting like it is no existent.

    How can I get the image to show up on the page and not get cut off, and adjust the margins so they are equal 5px on each side?
    Thank you

    http://everydayhealthylifestyles.com/

    #28485

    Pinky
    Participant
    Post count: 93

    Try adding this to the bottom of your custom style.css

    #content-sidebar-wrap {
    width: 960px;
    float: left;
    }
    

    That will move the whole page over to the left and will also fix the right hand side image issue for you.


    cheers

    Pinky

    #28491

    Pinky
    Participant
    Post count: 93

    oh and then you’ll need to move the top part over so give this a try:

    Around the content to the right of the logo – put a div like this:

    <div id="healthyheadline"> image here
    Hello Healthy Food Lover,
    How amazing would it be to walk into your kitchen each 
    morning to find it power- stocked with energizing whole
    foods, healthfully cleaned with non-toxic cleaners and
    highly organized for easy access? Three areas to fully 
    support your wellness journey to fabulous health and 
    a positive lifestyle!
    Sounds wonderful, right? Well, today you can start the 
    conversation to take back your kitchen with The Ultimate 
    Kitchen Detox for Healthy Food Lovers!
    </div>
    

    Then a little bit of css magic…

    #healthyheadline {
    margin-left: 200px;
    }
    

    Give that a shot and see how it goes… but don’t forget to take a backup of your files before you play around with them lol.


    cheers

    Pinky

    #28677

    jmfoust
    Participant
    Post count: 10

    Thank you! The image is still hitting the edge of the right.  Can I move it over a bit more?

    #28692

    Pinky
    Participant
    Post count: 93

    Sure can!

    Add this to your style.css :

    .size-medium.wp-image-65.alignright {
    margin-right: 35px;
    margin-top: 45px;
    }
    

    I’ve added margin-top so it moves it down a touch and lines up with the bullet points rather than the headline, if you don’t want that just remove the line margin-top: 45px;

    If you want to move it around more – just play with the margin-right number


    cheers

    Pinky

    #29176

    jmfoust
    Participant
    Post count: 10

    Hi Pinky, thanks, but its not moving at all.  I wonder if it is due to prose settings in Design?  Any suggestions?

    #29206

    Pinky
    Participant
    Post count: 93

    Ok let’s try another approach… add this to your style.css

    .size-medium.wp-image-178.alignright {
    margin-right: 50px;
    margin-top: 45px;
    }
    

    And that should absolutely do the trick – it’s css JUST for that one image.

    Lemmee know how ya go!


    cheers

    Pinky

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.