www.webdeveloper.com
Results 1 to 6 of 6

Thread: Changing Height onResize in IE

  1. #1
    Join Date
    Oct 2008
    Posts
    78

    Changing Height onResize in IE

    Ok so i'm making a website for my young enterprise company at school, it is located at:

    http://verve-enterprise.co.uk

    Now i understand that using tables or divs with percentage widths is the perfect fluid layout but i tried for oh so long to achieve what i want with CSS alone and it did not work.

    Basically, theres a main blue area, with an inner white area, where the text is. I want the main blue area to take up at least (so minimum height) the size of the page, so even if there is little content, the main colour block fills the page. Then the inner white area also comes down to the appropriate height. So i got all this working with javascript, until i realised, what happens if the user resizes the browser. It will look terrible! So i wrote a resize script that seems to work in FF but not in IE, even though i know the event fires (did an alert test).

    So i don't understand how i can either get IE to work this, or do it another way. I know the coding is messy, but its in early dev stages.

    Thanks in advance,
    Marc

  2. #2
    Join Date
    Oct 2008
    Posts
    78
    Bump

  3. #3
    Join Date
    Dec 2008
    Posts
    488
    I don't suppose it would be possible to get you to draw a picture of exactly how you want it to look, would it? Maybe what you're trying to do CAN be done with the right CSS. The window resize thing would be done in javascript, but let's knock out the layout first. Maybe we can write something that will degrade nicely, too.

  4. #4
    Join Date
    Oct 2008
    Posts
    78
    Ok, here is an idea of what i want. I have this blue background that extends to the width of the page either side, but has a minimum width, and extends to the bottom of the page (leaving a little padding or white gap) and that is its minimum height. Then there is a main inner white section for the main content, which should extend to the bottom of the blue area, leaving a gap for the footer.

    I'm using tables CSS and javascript atm and still not working the way i want when resizing. To go with a mainly tables/css version would be ideal, but im not really sure how to do this/have tried and failed XD

    Cheers
    Attached Images Attached Images

  5. #5
    Join Date
    Dec 2008
    Posts
    488
    Ok, I'll see if I can put together a layout for you and I'll post it back here. It will be simple, but it will be something you can adjust to fit your needs. I'll include some explanations of how to use "margin: auto;" to center a page and still have backgrounds that go all the way to the edge. As for the bottom, it will be a little more complex, but try to remember that you don't want to worry about the bottom. Let it fall where it may, because your page will look worse if you have a long, empty, white rectangle than it would if the blue simply came up to meet the bottom. I wouldn't worry about where the bottom falls, only that the background extends all the way down.

  6. #6
    Join Date
    Oct 2008
    Posts
    78
    ok thanks appreciate it!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles