Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8

Thread: css help

  1. #1
    Regular Coder
    Join Date
    Feb 2005
    Location
    UK
    Posts
    133
    Thanks
    0
    Thanked 0 Times in 0 Posts

    css positioning problems

    Hi,

    I'm having some trouble with some css, it's not working how I wanted it to (story of my life). I have wacked up a sample css page to show where I'm going wrong. (sorry about the awful colours)

    http://www.noodles.net.nz/test1.htm

    The problem that I'm having is I'm trying to get the footer to display underneath everything, at the moment it just displays underneath the content, which is fine until there isn't much content. I'm trying to keep the content as far up the page as possible, hopefully above the header and side menus (for seo purposes).

    Thanks in advance
    Last edited by Noodles24; 02-08-2005 at 04:35 AM.

  • #2
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Hello, welcome to the forums.

    First of all, please direct your attention to the bold text decorated with a yellow warning sign. It says "Before you post, read our Rules & Posting Guidelines." Now, please take the time to read said request. Please help us keep this forum organized by using a more appropriate title for your thread.

    Now, about your problem... You are using absolute positioning to position the columns, which is fine, but it takes the element "out of flow"; in other words, other elements ignore them. So the footer doesn't even see the columns, it just goes where it would have gone if they weren't there, which is halfway up the page.

    To do what you need, you should combine a little relative positioning, or perhaps float things where you need them. It's a little detailed to explain here, but here is a good tutorial:

    http://www.brainjar.com/css/positioning/default.asp

    If you need additional help after that, just post back and we'll be glad to help you out.

  • #3
    Regular Coder
    Join Date
    Feb 2005
    Location
    UK
    Posts
    133
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for your reply and my bad about the topic title, I should have known better

    I have read that tutorial before and read it again as you suggested, but am still no closer to my goal. I am a complete css newbie, so please bear with me.

    Should I be trying to float the footer as well as the left/right menus?

  • #4
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Hey,

    Well, sorry to be so short, but there are a zillion ways to do what you are trying to do. A 3-column-type layout has so many ins and outs that unless you have something specific I'll be here typing all day

    Not to worry, though, here's a link to a collection of three column layouts. Browse through them, pick one you like, and go from there...

    http://css-discuss.incutio.com/?page=ThreeColumnLayouts

    When you get stuck on something in particular I'd be glad to help you out. Since you are already using position: absolute, I'd take a look at some layouts that do the same. The gist is you will wrap your "table" in a wrapper, assign that position: relative, and assign the other divs positions within that wrapper div.

    Hope this helps,

    Rich

    Edit: I found this link on that page... it should be pretty close to what you are trying to do...

    http://www.pmob.co.uk/temp/3colfixedtest_3.htm

    Hope it works!
    Last edited by rmedek; 02-08-2005 at 03:12 AM.

  • #5
    Regular Coder
    Join Date
    Feb 2005
    Location
    UK
    Posts
    133
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Cool, thanks for the collection of templates, I'll have a pick through them and see if anything works for me

    Thanks for your help

  • #6
    Regular Coder
    Join Date
    Feb 2005
    Location
    UK
    Posts
    133
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok, I had a play around with some of the templates on that site and this one seems to be the closest to my needs. Only problem is the left and right menus need to be set widths and the middle will be expandable (for different resolutions). I can't for the life of me make it work like that using this template.

    Can anyone help me with that?

  • #7
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Which template? If it's the one I recommended the middle column expands with the browser window and the left and right columns are a fixed width. The footer rests at the bottom of the page.

    Post a link to your (new) code and I'll see if I can help you out.

  • #8
    Regular Coder
    Join Date
    Feb 2005
    Location
    UK
    Posts
    133
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The one you recommended works fine, although we're trying to get the content as far up the page as possible, preferably before the left/right columns

    the page i'm working on now is http://www.noodles.net.nz/test3.htm


  •  

    Posting Permissions

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