SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Apr 2005
    Posts
    81
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Exclamation CSS Frames Layout Problem

    Hello I am relatively new to CSS. I am looking to create a layout that resembles to:

    http://extjs.com/deploy/ext-2.0-alph...t/complex.html

    and/or

    http://www.dhtmlgoodies.com/packages/dhtml-suite-for-applications/demos/demo-pane-splitter.html


    However in order to use those I will have to know lots of javascript.

    That is why I am trying to use CSS to create a CSS Frame layout for an intranet application. So far the best library I found is Dynamic Drive's CSS Templates.

    I found one that I like:

    http://www.dynamicdrive.com/style/layouts/item/css-left-top-and-bottom-frames-layout/


    However I would like the left frame to be under the header and footer, like in this example:

    http://www.cssplay.co.uk/layouts/body4.html

    It is just that I dont know how to modify it.

    I attached an example of what I am trying to accomplish.

    By the way I am using the CSS Frames layouts and not the css liquid layouts because I need the interface to fill the whole browser window.

    Any help? or does any one knows where to find a better layout example for an intranet application like the first 2.

    Thanks
    Attached Images Attached Images

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Why do you need such a complicated layout? Can't you use a standard "in the flow" model instead.

    These type of frame layouts are always hard to achieve and usually have a number of problems associated with them.

    Here is an example I did for a post the other day:

    http://www.pmob.co.uk/temp/toggle-2-100-columns3.htm

    It was based on this simpler example that I did a while ago:

    http://www.pmob.co.uk/temp/2scroll2.htm

    However unless you have some special reason for using a frame type layout it would be much better if you used something like this instead.

    http://www.pmob.co.uk/temp/2col-nofloatdrop2.htm

  3. #3
    SitePoint Enthusiast
    Join Date
    Apr 2005
    Posts
    81
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I will use it for a corporate intranet so I want it to have a desktop like interface, that is why is so important that it fills the browser window. Thanks a lot for the example, although I do have a question about the 3rd one... what makes it so different from the first one.... thanks

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    In the third example the footer will move down when content pushes it down just like any normal page.

    The first two are frame type examples and the individual sections will apply scrollbars when the content reaches the bottom thus leaving the footer at the bottom of the viewport and the header at the top of the viewport at all times much the same as a frame layout.


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
  •