Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Problem with full width bg on elastic site

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #23080
    ianperrett
    Member

    Hi All,

    I am trying to build an Elastic site that sits on top of background images that stretches the full width of the browser (see target.gif). I have done it so i have a div with width set to 100% with the background image placed on this and then a div inside that set to 98em width and margin auto to center the site. I have this div set-up for the header(white bar), navigation(grey bar) and content area (dark grey bar). I have done it like this so it scales correctly.

    The issue is that when the site scales beyond the width of the browser the background images stop (breaking.gif).

    Does anybody know how to get round this.

    Cheers Ian

    #49202
    ianperrett
    Member

    Hi Chris

    Thanks for replying, the trouble with putting it on the background is that when the text size in increased or decreased the background image stays the same height and so the content looks out of place. With the current solution the backgrounds grow and shrink (particularly the nav bar) with the text size as i have given them a height value.

    The only way I can think of sorting this problem is to give the containing divs a width and use JavaScript to change this.

    btw. Thanks for creating such a great resource, it has helped me lots in learning and homing my CSS skills.

    Cheers Ian

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.