I want to position a layer inline within an HTML document, but I dont want it to move the other elements.
I have done this in Internet Explorer,
the layer is positioned absolutly,
but without a top or left value so that it stays inline,
then underneath the div I put an image to hold the place where the layer is (this is so that at first it doesnt cover over any page content, I will change the size of the layer later dynamically with javascript):
However, this doesn't seem to work for Netscape, Firefox or Opera.
I need to figure out how I can make this happen in the other browsers, but it doesnt have to be a single stylee sheet, I can load the style sheet seperatly for each browser.
Thanks for any help.
I have done this in Internet Explorer,
the layer is positioned absolutly,
but without a top or left value so that it stays inline,
then underneath the div I put an image to hold the place where the layer is (this is so that at first it doesnt cover over any page content, I will change the size of the layer later dynamically with javascript):
Code:
<html>
<head>
<style>
#over
{
background-color: #dedede;
border: 1px solid #999999;
display: block;
height: 100px;
overflow: hidden;
padding: 0px;
position: absolute;
text-align: center;
width: 500px;
}
</style>
</head>
<center>
<div id="over">
<img src="img" width="500" height="100" alt="Over Layer">
</div>
<img src="img" width="500" height="100" alt="Holding Area">
</center>
</body>
</html>However, this doesn't seem to work for Netscape, Firefox or Opera.
I need to figure out how I can make this happen in the other browsers, but it doesnt have to be a single stylee sheet, I can load the style sheet seperatly for each browser.
Thanks for any help.
