Reply
Old 08-08-2006, 05:45 AM Relative Positioning
Junior Talker

Posts: 2
Name: Jonathan
Trades: 0
I'm having a slight problem, I've managed to work round it, but it's not elegant so was hoping someone might have a better solution.

Basically I have a site that is your basic banner, 3 columns, footer (although the footer is inside the middle column).

What I have is a div for the header, underneath it I have a div that contains the 3 columns. This is positioned relative, so that I can use absolute positioning on the 3 columns.

BUT, the containing DIV seems to have no width or height, but I want to style it with a drop shadow graphic.

It seems to be that if a DIV is positioned relative, and it's only content is absolutly positioned divs the DIV dosn't grow around it's content, which I guess is in line with the old box model.

Is there a way to get the containing div to actually grow around it's content when it's positioned absolute/relative and so are it's children?
japatchett is offline
Reply With Quote
View Public Profile
 
 
When You Register, These Ads Go Away!
Old 08-08-2006, 03:11 PM Re: Relative Positioning
chrishirst's Avatar
Super Moderator

Posts: 25,278
Location: Blackpool. UK
Trades: 0
It's not the box model, old or new.

any elements absolutely positioned are taken out of the document flow, so have no effect on heights, widths or positions of other elements whether they are outside, inside or alongside them.
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 08-08-2006, 03:23 PM Re: Relative Positioning
mushu's Avatar
Novice Talker

Posts: 8
Trades: 0
FWIW, Chris is correct. Absolute takes it completely out of the "flow" for rendering. Not sure what browser you're using for testing, but I recommend Firefox/Opera first and I.E. last (in strict mode with the proper DOCTYPE) before you attempt to troubleshoot CSS rendering issues...no use wasting time fighting the browser as well as code errors!
mushu is offline
Reply With Quote
View Public Profile
 
Old 08-08-2006, 04:04 PM Re: Relative Positioning
vangogh's Avatar
Post Impressionist

Posts: 9,773
Name: Steven Bradley
Location: Boulder, Colorado
Trades: 0
Yeah it's a document flow thing. What you might do is have one of the columns not use postioning and use margins instead to display it where you want. The it will remain in the document flow. You would typically want to do this on the column that will generally be the greatest in height. You could then either float the other two columns or use positioning.

Here's an article I wrote on setting up a 3 column layout in css. It's certainly not the only way to set things up and you can see the layout has the footer outside the 3 columns, but I think it will give you some ideas how you can layout your site.

Hope it helps.
__________________
l Search Engine Friendly Web Design | Van SEO Design
l Tips On Marketing, SEO, Design, and Development | TheVanBlog
l Custom WordPress Themes
| Small Business Forum
vangogh is offline
Reply With Quote
View Public Profile Visit vangogh's homepage!
 
Reply     « Reply to Relative Positioning
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 


Page generated in 0.10710 seconds with 13 queries