Image Size Issuse: Balance Theme

Community Forums Forums General Discussion Image Size Issuse: Balance Theme

This topic is: not resolved

This topic contains 4 replies, has 2 voices, and was last updated by  ModernMuse 1 year, 4 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #41438

    jkennedy
    Participant
    Post count: 3

    Hey Forum Friends,

    I’ve gotten frustrated and can’t figure this out. So, wanted to ask for help! Here is my site (http://teachgoodstuff.com/) and I’m using the Balance theme.

    I’ve placed an image in the Header Left Widget, but it is not keeping the original size. Also, I would like it to be aligned with the opt-in plugin and both of them centered on the page.

    I’m thinking I need to change something in the css code, but not sure what! I’ve only made changes to the HTML in the widget.

    If you could point me in the right direction, I would be very grateful!  :)

    Cheers,

    Jennifer

     

     

     

    #41447

    ModernMuse
    Participant
    Post count: 54

    Hi Jennifer,

    If you’re comfortable modifying CSS, try this…

    Starting on Line 511, the background should be aligned top vs. left.

    You can copy & paste the following…

    [css]
    <pre>
    <div class="webkit-line-content">#home-featured {</div>
    <div class="webkit-line-content">background: url("http://teachgoodstuff.com/wp-content/uploads/2013/05/Jennifer1_2.jpg&quot ;) no-repeat scroll top center #F2FAFF;</div>
    <div class="webkit-line-content">margin: 0 0 50px;</div>
    <div class="webkit-line-content">}</div>
    [/css]

    Starting on Line 537, the code should look like this…

    [css]</em>

    <div class="webkit-line-content">.home-featured-right {</div>
    <div class="webkit-line-content">background: url(images/dashes-bg.png) #d05353;</div>
    <div class="webkit-line-content">border: 5px solid #fff;</div>
    <div class="webkit-line-content">font-size: 16px;</div>
    <div class="webkit-line-content">margin: 0 auto;</div>
    <div class="webkit-line-content">width: 430px;</div>
    <div class="webkit-line-content">}</div>
    <pre><em id="__mceDel">[/css]


    The code above differs in that the right float has been removed & the margin has been modified so that the opt-in box is centered.


    #41448

    ModernMuse
    Participant
    Post count: 54

    Jennifer, disregard the code above. It’s not pasting in correctly from the browser.

    Let’s see if it works this time…

    Line 511

    [css]

    #home-featured {
    background: url("http://teachgoodstuff.com/wp-content/uploads/2013/05/Jennifer1_2.jpg&quot ;) no-repeat scroll top center #F2FAFF;
    margin: 0 0 50px;
    }

    [/css]

    Line 537

    [css]

    .home-featured-right {
    background: url(images/dashes-bg.png) #d05353;
    border: 5px solid #fff;
    font-size: 16px;
    margin: 0 auto;
    width: 430px;
    }

    [/css]


    #41455

    jkennedy
    Participant
    Post count: 3

    Woohoo! Thanks for the help!!

    I’m not sure if I’m doing things wrong, but at least I have the photo exactly where I’d like it placed. I’m still having trouble with the opt-in box. I would like to move it right so that it’s not on top of the photo. I’ve tried changing all sorts of pieces in the code! Ha. But, still haven’t figured it out!  Is there another line that I need to change?

    Thank you so much!!

    JK

    #41541

    ModernMuse
    Participant
    Post count: 54

    Hi Jennifer,
    Glad I could help!

    I took a peak at the site and it looks like you’ve got it all sorted now. Apologies for the delayed response. :)


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

You must be logged in to reply to this topic.