Hi all, this is my first post here. 
<br />
<br />
Anyway, I have an IFrame and I want a logo to load in the bottom corner of each page. It is a large logo, so a table is a no go since I want text to be able to go over top of this logo if need be. It can't be a background either, becuase I already have a background, and my iframe is % size so I don't know a set location, I just want it always in the bottom right corner. <br />
<br />
I have a style working in Netscape 7 with this code.<br />
<br />
<br />
#pageIcon {<br />
position: fixed;<br />
right: 0%;<br />
bottom: 0%;<br />
visibility:visible;<br />
}<br />
<br />
<br />
Problem is it does not work in IE 6. Does anyone have any ideas?<!--content-->IE won't do position: fixed. i don't think there's a workaround that doesn't involved DHTML. (even the w3c couldn't get it to work!)<!--content-->Thanks, Crappy for me.
What would the dhtml method involve? I'm not really familar with it.<!--content-->just a buncha javascripting. i don't know how, but i'm certain it can be done. the thing is, you'd sorta hafta pick one method, unless you want to make your page even more complicated. but try some of the scripting sites, i think there's something that'll do that that may even work in both IE and Moz/NS. 95% of the things i've seen that were in that vein have been really choppy-looking, though (as far as staying put as the screen is scrolled).<!--content-->I've noticed that there is ways to set backgrounds in certain areas, is there anyway to have more than one background? I'm trying to think of a nice way to do this, since I really want it to be there.<br />
<br />
I was also thinking of putting it in a table the size of the whole screen and use valign bottom and align right, and then using a style position for another table on top of that table that would have all my content in it. The problem is I don't know how I would keep this scalable table in sync with the table below it.<!--content-->to set an image to always be in the bottom corner you can place it in a div and set the top and left padding to 100%
<br />
<br />
/added<br />
<br />
ofcourse that would be for the bottom right corner<!--content-->leoo24, I'm not sure I follow. What kind of positioning should I use? And do you mean padding-top: and padding-left:? Because when I put them at 100% the image is way off the screen with scroll bars. <!--content-->ok this has always been a tricky thing for many people,<br />
easiest way is to use a table to place the image but put the table in a div and set it's z-index to be below everything else, that way you can still write over it as you said you wanted to do, like this:<br />
<br />
<div style="position:absolute;width:100%;height:100%;z-index:1;left:0px;top:0px;"><br />
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;height:100%;"><br />
<tr><td style="text-align:right;vertical-align:bottom;"><img src=http://www.htmlforums.com/archive/index.php/"foo.jpg" width="134" height="94" alt="" border="0"><br />
</td></tr></table></div><!--content-->Thanks leoo24, that worked great.<br />
<br />
One other question if you don't mind. Is there anyway to put that data into a style sheet? because it doesn't seem to work if I try to include it from a style sheet.<br />
<br />
<br />
<div style="position:absolute;width:100%;height:100%;z-index:2;left:0px;top:0px;"><br />
<br />
<br />
works above, but doesn't work like this. <br />
<br />
<br />
#contentTable {<br />
postion:absolute;<br />
width:100%;<br />
height:100%;<br />
z-index:1;<br />
left:0px;<br />
top:0px;<br />
}<br />
<br />
<br />
using <div id = "contentTable"><br />
<br />
Even if I can't put it in a style sheet, still a great tip. :rocker:<!--content-->hmm, everyone does things differently and i tend to not use id, call it in with a class<br />
<br />
div.contentTable {blah blah ....}<br />
<br />
<br />
<div class="contentTable"><br />
<br />
<!--content-->By the way, what does the CSS attribute "z-index" stand for?<!--content-->
<br /><br />
Anyway, I have an IFrame and I want a logo to load in the bottom corner of each page. It is a large logo, so a table is a no go since I want text to be able to go over top of this logo if need be. It can't be a background either, becuase I already have a background, and my iframe is % size so I don't know a set location, I just want it always in the bottom right corner. <br />
<br />
I have a style working in Netscape 7 with this code.<br />
<br />
<br />
#pageIcon {<br />
position: fixed;<br />
right: 0%;<br />
bottom: 0%;<br />
visibility:visible;<br />
}<br />
<br />
<br />
Problem is it does not work in IE 6. Does anyone have any ideas?<!--content-->IE won't do position: fixed. i don't think there's a workaround that doesn't involved DHTML. (even the w3c couldn't get it to work!)<!--content-->Thanks, Crappy for me.
What would the dhtml method involve? I'm not really familar with it.<!--content-->just a buncha javascripting. i don't know how, but i'm certain it can be done. the thing is, you'd sorta hafta pick one method, unless you want to make your page even more complicated. but try some of the scripting sites, i think there's something that'll do that that may even work in both IE and Moz/NS. 95% of the things i've seen that were in that vein have been really choppy-looking, though (as far as staying put as the screen is scrolled).<!--content-->I've noticed that there is ways to set backgrounds in certain areas, is there anyway to have more than one background? I'm trying to think of a nice way to do this, since I really want it to be there.<br /><br />
I was also thinking of putting it in a table the size of the whole screen and use valign bottom and align right, and then using a style position for another table on top of that table that would have all my content in it. The problem is I don't know how I would keep this scalable table in sync with the table below it.<!--content-->to set an image to always be in the bottom corner you can place it in a div and set the top and left padding to 100%
<br /><br />
/added<br />
<br />
ofcourse that would be for the bottom right corner
<!--content-->leoo24, I'm not sure I follow. What kind of positioning should I use? And do you mean padding-top: and padding-left:? Because when I put them at 100% the image is way off the screen with scroll bars. <!--content-->ok this has always been a tricky thing for many people,<br />easiest way is to use a table to place the image but put the table in a div and set it's z-index to be below everything else, that way you can still write over it as you said you wanted to do, like this:<br />
<br />
<div style="position:absolute;width:100%;height:100%;z-index:1;left:0px;top:0px;"><br />
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;height:100%;"><br />
<tr><td style="text-align:right;vertical-align:bottom;"><img src=http://www.htmlforums.com/archive/index.php/"foo.jpg" width="134" height="94" alt="" border="0"><br />
</td></tr></table></div><!--content-->Thanks leoo24, that worked great.
<br /><br />
One other question if you don't mind.
Is there anyway to put that data into a style sheet? because it doesn't seem to work if I try to include it from a style sheet.<br /><br />
<br />
<div style="position:absolute;width:100%;height:100%;z-index:2;left:0px;top:0px;"><br />
<br />
<br />
works above, but doesn't work like this. <br />
<br />
<br />
#contentTable {<br />
postion:absolute;<br />
width:100%;<br />
height:100%;<br />
z-index:1;<br />
left:0px;<br />
top:0px;<br />
}<br />
<br />
<br />
using <div id = "contentTable"><br />
<br />
Even if I can't put it in a style sheet, still a great tip. :rocker:<!--content-->hmm, everyone does things differently and i tend to not use id, call it in with a class<br />
<br />
div.contentTable {blah blah ....}<br />
<br />
<br />
<div class="contentTable"><br />
<br />
<!--content-->By the way, what does the CSS attribute "z-index" stand for?<!--content-->