SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Mar 2005
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE, FF, and height=100%

    I'm so frustratied with the IE vs FF and who supports what or what is "broken" and what in "correct" I could scream. Most of what I read hear rails on IE about how it behaves or does not conform, but the truth is...it's FAR easier to developer an Web Application in IE than anything else, been doing it for years with no problems, at least not layout. Now along comes FF and the rebirth of the damn browser wars.

    My applications frequently use third party menus, tabs controls, and custom data aware controls, and all I usually need to do is drag and drop onto the page and set a few custom properties and everything in beautiful in IE. I also frequently use Iframes because it allows the web app to function more as an application, with only the content area being fetched.

    In any event, what I would LOVE somebody to show me is a 3 "section" design (not column) that works equally well in IE and FF. By section I mean a fixed height header, a fixed height footer, and a content area that sizes height-wise to the viewport if the browser is elongated. I have seen a lot of people say they have it working and I have spent all day looking at a lot of them. I have yet to see one that allow you to place a table in the content section and have the table size according to the viewport from a height perspective (works in IE, not FF). I definitely need tables in my applications as I'm always laying out data pages that have labels and fields or using datagrid controls, and there is no way I want to try this with just DIV tags.

    My ultimate solution is to have the center section have a table that has two rows, don't care if they are divs or what...the top row will contain a fixed height tab control I use, but my problem area is the second row. I desparately need this to be an iframe that show content when things are clicked in the top row. This all works very easily in IE, but what I cannot get to work right in FF is having the second row use overflow:auto correctly. IE does it perfectly, when content is loaded into the bottom section the scroll bar turns on and if I increase the viewport size of the browser by elongating the browser size, the scroll bar appropriately dissappears.

    Anybody out there have a real clue on how to accomodate this 3 section type of layout that works for those of us who use tables to layout fields or controls in the center content section?

    I'm ready to whorship somebody if they can show me how to get this working across the browsers

    Thanks for any help in advance...

  2. #2
    SitePoint Enthusiast
    Join Date
    Mar 2005
    Posts
    29
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello Randy,

    I've encountered similiar problems and found that the following resource helped me with my quandary. Although there are certain limitations to using it, it may be helpful in your situation. I realize you stated you wanted something using no columns and this site does, however it may provide some further insight.

    Resource 1

  3. #3
    SitePoint Wizard gold trophysilver trophybronze trophy dc dalton's Avatar
    Join Date
    Nov 2004
    Location
    Right behind you, watching, always watching.
    Posts
    5,431
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Im actually working on a web app right now that is doing almost exactly the same thing as you are describing (I think) but alas until it goes live its VERY hush hush and I would be breaking an NDA by showing it to you..

    I have used a "hybred" layout as (I think) you have described here and to be very honest Im not 100% sure I see the problem you are having. But again, maybe Im not understanding you correctly...

    Do me a favor and take a look at the search engine link in my siggie and tell me if that is anything like you need. I did this layout before I was 100% confident in my ability to do a tableless site. It a REALLY basic simple layout but if this is close to what you need I MAY be able to show you a few things (on the sly) that MIGHT help..

  4. #4
    SitePoint Member
    Join Date
    Mar 2005
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks to both of you for the efforts, but unfortuantely those sites would not come close to what I need. Many of the data controls used in .Net return tabular HTML data i.e. the server controls generate HTML in tables before sending requested page back to the client. This being the case, there is no way that pure divs can handle all of that presentation of data. What divs could do, and what I'm trying to find, is where a table could be placed inside of an expandable div and scale with the page as the viewport is expanded. I have yet to find any instance of where a table can successfully do this inside of a div.

    The reason is that the table cannot determine the proper containing divs height when all these CSS hacks and stuff ar being used.

    Please don't take this the wrong way, I truly do not mean any direspect to anybody, but those of you who are advocating divs and CSS for all sites, and the elimination of tables for layout are not developing full scale web applications. Unless tables are used in the layout of web applications, the scenario for building data driven sites becomes a nightmare and I simply do not see how divs alone could handle this load.

    If I'm wrong about all this, would somebody please show me a site out there that presents tabular data that properly scales according to the viewport when resized in FireFox? Many thanks in advance if you can do that.

  5. #5
    SitePoint Member
    Join Date
    Mar 2005
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Were you looking for a lay-out like the following?
    MSIE: http://www.bonwon.com/tmp/code_msie.html
    Firefox: http://www.bonwon.com/tmp/code_ff.html

    The code is still in development, because it's part of a project that needs a 3 row lay-out. Would be easy with frames (<frameset cols="100,*,30">), but that's not a go in this project. Would appreciate any help for a cross-browser solution! =)


Bookmarks

Posting Permissions

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