-
layer divs inside cells?
I’ve got a site I’ve designed with tables. The page is liquid in that it always stays centered, buy using a combinatin of a table inside another single celled table which is 100% wide and high, with a middle alignment.
However, now I need to add a layer into one of the cells and have it stay in place as you scale the browser window. All I’ve done, without the right code brackets is place this code within the TD tag…
[div id=”Layer1″ style=”position:relative; left:10px; top:260px; width:308px; height 40px; z-index:1″]Here’s some content[/div]
And when I do that, it does put the layer in the right spot and it moves perfectly with the scaling of the window/cell, but it also adds a blank area to the cell at the top, equal to the height of the layer. If I make the layer height 0 or empty, then the blank area at the top of the cell increases with the height of the content I put in the layer.
Any ideas?
-
6 Replies
-
hello…
ooh – this one might be easier to debug with an example – perchance do you have one?
sitruc
-
Ok, I’ve temporarily uploaded it to https://recalltohonor.com/homepage.php
The white area at the top is always the same size as the div layer. More text = more white space. I don’t use layers generally, but it’s time to make the switch. If I can get this figured out I may try to recreate the site without tables.
-
hello…
ya – it’s due to the position:relative thing – it still exists in the page, but then you force it down lower – but at render time, it’s still up there, hence the white spot… :-/
i’d move your picture into the background property of the table cell to get around this:
https://sitruc.com/cow/recalltohonor.html
note that i made a local version of the random image generator there to get the url references right from my server…but this works in firefox, safari and ie…
sitruc
-
Hmmm. Works! Except I can’t seem to get my random image generator to work now. I wasn’t aware that you could use it on the bgrnd image or I would have done that from the start. But I’m just getting nothing now. I inserted your bgrnd code, and the table to keep the size, but it’s not calling the random image. I shouldn’t have had to change anything, or do I have to put the script inside the page now instead of externally?
I reuploaded.
-
hello…
looks like your changePic is still the old one – you are trying to change the src of myPicture, but you should use the document.getElementById one:
document.getElementById(“myPicture”).style.backgroundImage = ‘url(‘ + myPix[randomNum] + ‘)’;
that should do it…
sitruc
-
Aha!
I wasn’t aware that you had changed the javascript! I thought you had just changed the call from a picture to a background picture with the ID=”” Now I get it. I was able to get it to work when I left the script inline, which is actually just fine. But when I tried to link to my old script (forget where I got that – I didn’t write it) it was blank.
Good to go now. I think.
Reply to this Discussion! Login or Sign Up