Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • November 6, 2015 at 8:35 am #531358
    jordandsa

    Hi There,

    I’m using a COLOR SECTION with a background image and I’ve given it a unique ID. Could you please provide me with the css to make the background image auto-resize with the browser window? I’d like it to shrink when the browser window gets smaller, otherwise the content runs over it and I can’t read it.

    http://juliewittner.com/credits/

    If you resize the browser window to a small window, the text runs over the background image. I’d like the background image to get smaller when the window gets smaller.

    Thanks :)
    Jordan

    • This topic was modified 9 years ago by jordandsa.
    November 6, 2015 at 4:35 pm #531511
    Elliott

    Hey Jordan!

    Try using a grid row element instead. It’s cells will resize depending on the screen size.

    Regards,
    Elliott

    November 12, 2015 at 12:03 am #534465
    jordandsa

    That worked well for that page, but now I have a different problem. I’d like the BG image to be the entire page:
    http://juliewittner.com/reels-02/
    but resize with the browser window so the right column does not hover over the image and block the face.

    Also, the header cuts off the top of the COLOR SECTION background image. Is there a way to move the color section bg image down so the full image is under the header?

    Thanks so much.

    • This reply was modified 9 years ago by jordandsa.
    November 13, 2015 at 7:31 pm #535696
    Elliott

    Hey!

    Yes, you can set the header style to transparent when you edit the page.

    For the resizing with the grid row I don’t see an easy way of going about that. You would probably need to add the image with the image element in the first cell so it resizes with the browser width.

    Cheers!
    Elliott

    November 13, 2015 at 7:44 pm #535698
    jordandsa

    Thanks Elliot!

    Got the BG image issue solved per your suggestion.

    • This reply was modified 9 years ago by jordandsa.
  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Auto-Resize Background Image With Browser Window’ is closed to new replies.