Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Cross-Browser Element Bottom Position

Reply
Thread Tools

Cross-Browser Element Bottom Position

 
 
vunet.us@gmail.com
Guest
Posts: n/a
 
      05-04-2007
I have no perfect cross-browser solution to position html element on
the bottom of the page.
I know that with Firefox I do it as:
position:fixed; bottom:0px;
However, IE does not understand that. Did anyone come across this
issue to share with me?
Thanks you

 
Reply With Quote
 
 
 
 
-Lost
Guest
Posts: n/a
 
      05-04-2007
wrote:
> I have no perfect cross-browser solution to position html element on
> the bottom of the page.
> I know that with Firefox I do it as:
> position:fixed; bottom:0px;
> However, IE does not understand that. Did anyone come across this
> issue to share with me?


Yeah, Internet Explorer does not support that particular CSS declaration.

I imagine you could position the element taking into consideration its
height (and width if necessary), and the canvas height.

If the canvas is 600px tall, and your element is 100px tall, then
placement at 500px down (top: 500px would place it at the bottom.

http://jibbering.com/faq/#FAQ4_9

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
 
Reply With Quote
 
 
 
 
vunet.us@gmail.com
Guest
Posts: n/a
 
      05-04-2007
On May 4, 10:08 am, -Lost <maventheextrawo...@techie.com> wrote:
> vunet...@gmail.com wrote:
> > I have no perfect cross-browser solution to position html element on
> > the bottom of the page.
> > I know that with Firefox I do it as:
> > position:fixed; bottom:0px;
> > However, IE does not understand that. Did anyone come across this
> > issue to share with me?

>
> Yeah, Internet Explorer does not support that particular CSS declaration.
>
> I imagine you could position the element taking into consideration its
> height (and width if necessary), and the canvas height.
>
> If the canvas is 600px tall, and your element is 100px tall, then
> placement at 500px down (top: 500px would place it at the bottom.
>
> http://jibbering.com/faq/#FAQ4_9
>
> --
> -Lost
> Remove the extra words to reply by e-mail. Don't e-mail me. I am
> kidding. No I am not.


yes, that could be a way to handle.
a great way to handle top positioning in IE is to use this in CSS:
top:expression(this.offsetParent.scrollTop)
position:absolute;
i wish i could have something easy as that for bottom positioning

 
Reply With Quote
 
scripts.contact
Guest
Posts: n/a
 
      05-04-2007
On May 4, 8:34 am, vunet...@gmail.com wrote:
> yes, that could be a way to handle.
> a great way to handle top positioning in IE is to use this in CSS:
> top:expression(this.offsetParent.scrollTop)
> position:absolute;
> i wish i could have something easy as that for bottom positioning


position:absolite;
top:expression(document.body.offsetHeight-this.offsetHeight)

 
Reply With Quote
 
vunet.us@gmail.com
Guest
Posts: n/a
 
      05-04-2007
On May 4, 2:26 pm, "scripts.contact" <scripts.cont...@gmail.com>
wrote:
> On May 4, 8:34 am, vunet...@gmail.com wrote:
>
> > yes, that could be a way to handle.
> > a great way to handle top positioning in IE is to use this in CSS:
> > top:expression(this.offsetParent.scrollTop)
> > position:absolute;
> > i wish i could have something easy as that for bottom positioning

>
> position:absolite;
> top:expression(document.body.offsetHeight-this.offsetHeight)


does not work in my IE7.

but here is what I found for mozilla-based browsers:
body > div#myDiv{
/* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb
4.5+, iCab, ICEbrowser */
position: fixed;
}

 
Reply With Quote
 
vunet.us@gmail.com
Guest
Posts: n/a
 
      05-04-2007
On May 4, 4:07 pm, vunet...@gmail.com wrote:
> On May 4, 2:26 pm, "scripts.contact" <scripts.cont...@gmail.com>
> wrote:
>
> > On May 4, 8:34 am, vunet...@gmail.com wrote:

>
> > > yes, that could be a way to handle.
> > > a great way to handle top positioning in IE is to use this in CSS:
> > > top:expression(this.offsetParent.scrollTop)
> > > position:absolute;
> > > i wish i could have something easy as that for bottom positioning

>
> > position:absolite;
> > top:expression(document.body.offsetHeight-this.offsetHeight)

>
> does not work in my IE7.
>
> but here is what I found for mozilla-based browsers:
> body > div#myDiv{
> /* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb
> 4.5+, iCab, ICEbrowser */
> position: fixed;
>
> }


<style type="text/css">
#fixme {
/* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use
this */
position: absolute; right: 20px; bottom: 10px;
}
body > div#fixme {
/* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb
4.5+, iCab, ICEbrowser */
position: fixed;
}
</style>
<!--[if gte IE 5.5]>
<![if lt IE 7]>
<style type="text/css">
div#fixme {
/* IE5.5+/Win - this is more specific than the IE 5.0 version */
right: auto; bottom: auto;
left: expression( ( -20 - fixme.offsetWidth +
( document.documentElement.clientWidth ?
document.documentElement.clientWidth : document.body.clientWidth ) +
( ignoreMe2 = document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft ) ) +
'px' );
top: expression( ( -10 - fixme.offsetHeight +
( document.documentElement.clientHeight ?
document.documentElement.clientHeight : document.body.clientHeight ) +
( ignoreMe = document.documentElement.scrollTop ?
document.documentElement.scrollTop : document.body.scrollTop ) ) +
'px' );
}
</style>
<![endif]>
<![endif]-->

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
css "div" bottom of window or bottom of content. Dan HTML 1 04-04-2008 09:40 AM
Position an element dynamically on top of an existing element Konrad Hammerer HTML 14 02-07-2008 11:34 PM
how to Update/insert an xml element's text----> (<element>text</element>) HANM XML 2 01-29-2008 03:31 PM
How do we know the memory arrangement using in microprocessors? Top-Bottom or Bottom-Top? Cuthbert C Programming 8 09-13-2006 12:09 PM
CSS to put text at bottom of browser window, or page bottom, whichever is lower? Noozer HTML 1 03-13-2006 10:35 AM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57