ki Posted December 3, 2007 Share Posted December 3, 2007 Im trying to float a div over a div, ive tried different methods trying this yet non seem to work here is the code im trying to make the div float over: <style> div#subjects { margin-bottom: 5px; display: block; } div#msgbody { float: left; display: block; width: 100%; } div.CB { float: left; width: 50px; } div.FR { float: left; width: 100px; } div.SB { float: left; } div.MR { float: left; display: block; width: 100%; font-size: 14px; } </style> <div class="MH">Message(s)</div> <div id="subjects"> <div class="MR"><div class="CB"><input type="checkbox" name="mail[]"></div><div class="FR"><a href="">name</a></div><div class="SB"><a href="javascript:message('')">subject</a></div></div> </div> and this is the div I want floated: <div id="msgbody"> </div> its not going to be moved but its going to popup in the center of a holder div (non of the above divs) that displays a message with AJAX. any help is appreciated Quote Link to comment Share on other sites More sharing options...
obsidian Posted December 3, 2007 Share Posted December 3, 2007 You cannot "float" a div on top of another. You would have to absolutely position them on top of one another (using z-index to determine which is on top: HTML: <div id="container"> <div id="div-bottom"> I'm on bottom! </div> <div id="div-top"> I'm on top! </div> </div> CSS: #container { position: relative; } #div-bottom { position: absolute; z-index: 100; } #div-top { position: absolute; z-index: 200; } Try something like that instead. Quote Link to comment Share on other sites More sharing options...
ki Posted December 3, 2007 Author Share Posted December 3, 2007 your have to z-index them both? because I tried only one z-index Quote Link to comment Share on other sites More sharing options...
obsidian Posted December 3, 2007 Share Posted December 3, 2007 your have to z-index them both? because I tried only one z-index No, you don't have to, but I like to explicitly define anything that could possibly be misinterpreted by an obscure browser somewhere. Implicit CSS interpretation is not reliable in all browsers, sad to day. Quote Link to comment Share on other sites More sharing options...
corylulu Posted December 13, 2007 Share Posted December 13, 2007 i recommend not doing a full site with divs... try to do the underlining information with table structures and then put the div's over that. Quote Link to comment Share on other sites More sharing options...
themistral Posted December 13, 2007 Share Posted December 13, 2007 corylulu, My understanding is that tables will not be supported in the future browsers so getting to grips with divs as early as possible is important - do you know different? Quote Link to comment Share on other sites More sharing options...
phpQuestioner Posted December 13, 2007 Share Posted December 13, 2007 corylulu, My understanding is that tables will not be supported in the future browsers so getting to grips with divs as early as possible is important - do you know different? I have not heard that anywhere; I believe most all browser will continue to support "founding father" tags. Some CSS styles and JavaScript methods will depreciate though; FireFox already has depreciated several older CSS styles and JavaScript methods. Quote Link to comment Share on other sites More sharing options...
themistral Posted December 13, 2007 Share Posted December 13, 2007 Thanks for clarifying that phpQuestioner! I would still use divs over tables purely as my tabular code always seemed to get over-complicated and therefore bloated! But it looks like we will continue to have a choice for the foreseeable future Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.