WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] resizing issue

[Resolved] resizing issue

Viewing 15 replies - 1 through 15 (of 17 total)
  • Adjusting just fine at my end.
    The only difference is the orientation of the images (landscape and portrait).

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    I had to add padding to see your slider background image and yes, it was not resizing like the other images. It was skewing.
    Hopefully this CSS should stop that:

    background-size: 100%;

    ok – tried the background size but it wasn’t working.

    If you can, take a look now. the background is there and both slider and bg are resizing but the slider is being pushed below the background image. is that the right way to do this? then use a negative margin to position the slider?

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    You can do what you had before, have it a background image instead of an actual <img>. That’s the correct way.
    Alternatively use absolute positioning.

    I’m sorry but I don’t get what’s going on. I put it back in as a background image under the featured image div but now it again does not resize properly.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    I don’t see a background-size style in your stylesheet (if that’s where you’re making the change)

    It should be on this style;

    #featured-image

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Try making your changes through this plugin http://wordpress.org/extend/plugins/custom-css-manager-plugin/

    I am editing in the site style sheet.

    #featured-image {
    margin: 10px 10px 35px 10px;
    background: url(“http://macrodiver.com/wp-content/themes/macrodiver/images/slide-bgsm.png”);
    background-size: 100%;
    }

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    I tested it out by adding padding of 50px to #featured-image and resizing the browser. I could not find an issue [screenshot].

    The only issue I can see, which is easily resolvable as you know, is the repeated background.

    Are you looking at a particular browser?

    All right. It works full screen but the padding is too much when resized for mobile.

    thanks for the help.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Remember, padding, just like any other value, can be added using pixels, percentages, em, centermetres, inches, etc. I think percentages or em will be suitable.

    yeah, I’ve tried every possible way I can think of and no combination seems to get it working both ways. Beyond frustrated.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    If all fails you can just use a media query to remove/reduce the padding at mobile size:

    @media all and (max-width: 480px) {
    
    }

    I would suggest playing around with the padding for the title under the slider image. It has 40px top padding. I’ll post the css solution as soon as i load your site. Seems like you’re workin’ on it and it’s wont load atm.

    thanks – i’ll try adjusting the padding on the title.

Viewing 15 replies - 1 through 15 (of 17 total)
  • The topic ‘[Resolved] resizing issue’ is closed to new replies.
Skip to toolbar