Linux Format forums Forum Index Linux Format forums
Help, discussion, magazine feedback and more
 
 FAQFAQ   SearchSearch   MemberlistMemberlist   UsergroupsUsergroups   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 

CSS: Floating a nested div.

 
Post new topic   Reply to topic    Linux Format forums Forum Index -> Programming
View previous topic :: View next topic  
Author Message
Spitfire



Joined: Tue Aug 08, 2006 9:09 pm
Posts: 3
Location: High Wycombe

PostPosted: Tue Aug 08, 2006 9:14 pm    Post subject: CSS: Floating a nested div. Reply with quote

Hi,

I'm having a problem with some css. In order to get the menu to be on the left I set the float to left. However, this then produces a problem when the rest of the page content isn't enough to cover the height of the menu...

It's probably easier to understand by looking: http://www.arrowesecuritysystems.co.uk/new/

When the window is fairly narrow all is well and good, once the window is widened the menu juts out at the bottom.

I would appreciate any insight you may have into this.


Regards,
Matt
Back to top
View user's profile Send private message
Gordon
LXF regular


Joined: Thu Apr 07, 2005 6:01 pm
Posts: 209
Location: Bradford, West Yorkshire

PostPosted: Tue Aug 08, 2006 10:44 pm    Post subject: RE: CSS: Floating a nested div. Reply with quote

I've not tried floating a nested div in CSS. My method is to use absolute positioning for div's. See http://www.gordonmurgatroyd.pwp.blueyonder.co.uk/ for how I create menus. Also try looking at Eric Meyer's website and look at his CSS/Edge pages. You may be able to find info there.

Hope this helps.
_________________
Violence is the last refuge of the incompetent
Back to top
View user's profile Send private message Yahoo Messenger
Spitfire



Joined: Tue Aug 08, 2006 9:09 pm
Posts: 3
Location: High Wycombe

PostPosted: Tue Aug 08, 2006 11:21 pm    Post subject: Reply with quote

Hi,

The problem with absolute positioning, as well as this float method, is that the outer div - the one that produces the border effect - does not expand to surround the positioned items.

Thank you for the links though, some interesting ideas.


Regards,
Matt
Back to top
View user's profile Send private message
emyr42
LXF regular


Joined: Tue Nov 22, 2005 9:16 am
Posts: 147
Location: Cardiff, UK

PostPosted: Wed Aug 09, 2006 4:04 pm    Post subject: Reply with quote

Bah, browser rendering bug...

have you set a minimum height for the container div?
_________________
OpenSUSE 10.2, WinXPHome
AMD Sempron 2400, 512MB DDR333, Twin 60GB Deathstars
Back to top
View user's profile Send private message Visit poster's website
ollie
Moderator


Joined: Mon Jul 25, 2005 12:26 pm
Posts: 2749
Location: Bathurst NSW Australia

PostPosted: Wed Aug 16, 2006 10:31 am    Post subject: Reply with quote

Just a real quick look - I think you need a container around #sidebar and #content with a "clear: left" on the #content div.

A better place to ask this would be the Web Standards Group mailing list (also free) - you can also search the archives for solutions.

Sorry, I just haven't got time to troubleshoot your CSS - but using the View Source Chart Firefox extension makes this easier.
Back to top
View user's profile Send private message
Spitfire



Joined: Tue Aug 08, 2006 9:09 pm
Posts: 3
Location: High Wycombe

PostPosted: Wed Aug 16, 2006 8:02 pm    Post subject: Reply with quote

Thanks for your reply. I ran with that and ended up using the #content:after to have a clear: left; which I found on http://www.positioniseverything.net/easyclearing.html, to clear up the xhtml. It now looks as I intended... On firefox, I've yet to try it on IE.


Regards,
Matt
Back to top
View user's profile Send private message
View previous topic :: View next topic  
Display posts from previous:   
Post new topic   Reply to topic    Linux Format forums Forum Index -> Programming All times are GMT
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
Linux Format forums topic RSS feed 


Powered by phpBB © 2001, 2005 phpBB Group


Copyright 2011 Future Publishing, all rights reserved.


Web hosting by UKFast