ShadowMage Posted October 26, 2009 Share Posted October 26, 2009 Hi guys, me again.I just have a quick question about div's. They can be nested right?Ex. <div> <div>text</div> <div>more text</div></div> So why aren't they nesting for me? I have a similar structure as my example above. The problem is that the container <div> terminates after the first nested one. What gives? I also have some tables nested inside some div's as well as other div's and some span's and input's. I made sure that all of my tags are closed, in fact my code passes validation through the HTML Validator add-on for firefox.*Edit:I just tested this in IE and it works, just not in firefoxI'm completely lost, any and all help is very much appreciated. If there is any other information you'd need I'd be happy to post it.Thanks in advance,jkloth Link to comment Share on other sites More sharing options...
nigel.collier@virgin.net Posted October 26, 2009 Share Posted October 26, 2009 Nested DIV's are fine.I just cut and pasted your code in to HTML <body> tags and it displays fine in FF, IE, Chrome, Safari and Opera. The problem is that the container <div> terminates after the first nested one.What exactly do you mean by this - what is telling you that the <div> terminates? Link to comment Share on other sites More sharing options...
ShadowMage Posted October 26, 2009 Author Share Posted October 26, 2009 Nested DIV's are fine.I just cut and pasted your code in to HTML <body> tags and it displays fine in FF, IE, Chrome, Safari and Opera.What exactly do you mean by this - what is telling you that the <div> terminates?There is some background color formatting that only covers part of the area that the div is supposed to cover. Also if I add a border around it, the border encloses only part of what it is supposed to.This is how my code looks:<div class='tip_body'> <div style='width: 650px;'> <div class='systemHdr'>Wall Panel Systems</div> <!-- The formatting only gets this far --> <div class='skylightInfo'>...</div> ... </div> ...</div> The formatting for the tip_body stops after the systemHdr <div> Link to comment Share on other sites More sharing options...
Ingolme Posted October 26, 2009 Share Posted October 26, 2009 It sounds as if the second <div> element is either absolutely positioned or has been floated. Link to comment Share on other sites More sharing options...
ShadowMage Posted October 26, 2009 Author Share Posted October 26, 2009 It sounds as if the second <div> element is either absolutely positioned or has been floated.Yes, I have it floating to the left. But if it's inside another <div> that shouldn't matter should it. I've done that before with no apparent problems.You are refering to the skylightInfo <div> right? Link to comment Share on other sites More sharing options...
Ingolme Posted October 26, 2009 Share Posted October 26, 2009 Floated <div> elements are ignored when calculating the size of the parent element.If you want it to be taken into account, you must add overflow: auto; or overflow: hidden; to the parent element. Some browsers will only do it correctly if you have assigned a width to the parent element, but most of them will render it correctly in any situation. Link to comment Share on other sites More sharing options...
ShadowMage Posted October 26, 2009 Author Share Posted October 26, 2009 Thanks Ingolme,That did the trick! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.