div

[ki]

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

[obsidian]

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.

[ki]

your have to z-index them both? because I tried only one z-index

[obsidian]

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.

[corylulu]

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.

[themistral]

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?

[phpQuestioner]

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.

[themistral]

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