Re: FAQ Topic - How do I find the size of a browser window?

Lasse Reichstein Nielsen wrote:
Trond Michelsen <trondmm-usenet@xxxxxxxxxxxx> writes:

I'm pretty new to javascript, so it's not very obvious to
me how the size of a browser window is irrelevant. Let's
say you want to position a fixed element in the bottom
right corner of the window, what's the preferred method
of doing this?

CSS, e.g.
#botright { position: fixed; bottom: 0px; right:0px; }
However, that only works in browsers with CSS 2 support,
ruling out IE. Should you try to position (and continously
reposition) the element using javascript, you still don't
care about the window size.

Which doesn't mean that IE cannot do this with just CSS. If an
absolutely positioned block element is a child of the BODY element, has
bottom and right CSS properties set to zero and the width and height of
the BODY (and the HTML elements) are set to 100% then the will stay in
the bottom right of the viewport (more or less):-

<html>
<head>
<title></title>
<style type="text/css">
HTML, BODY {
width:100%;
height:100%;
margin:0;
padding:0;
}
#atBottomRight {
position:absolute;
bottom:0;
right:0;
margin:0;
padding:0;
font-weight:bold;
font-size:150%;
margin:0;
padding:3px;
color:#FFFFFF;
background-color:red;
}
</style>
</head>
<body>
<p>
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
xxx xxxxxxx xxxx xxxxx xx xxxxxx xxxxxxxxx xxx xxxx xxxx
</p>
<div id="atBottomRight">Some Text</div>
</body>
</html>

Richard.


.

Relevant Pages

  • Re: Binary Sunset - testing layout
    ... I'm a bit new to css and am not very confident with it ... BTW - Also, the Window Opening ... Pixels - which means the ScrollBars have to be drawn, ... instance, if the Browser Window is small, (or the Text Size the Viewer ...
    (uk.people.silversurfers)
  • Re: User setup
    ... click START then rightclick "All Programs" at the bottom then select Open ... Now you have another browser window with the start menu ... access to from the "All User" browser to the "Open" browser window. ...
    (microsoft.public.windowsxp.customize)
  • Re: Problems when I maximize
    ... Right-click on a link in the page and select: "Open in New Window" ... Close the first browser window using the (upper right corner) ... it back up it only shows on the bottom half of the screen. ...
    (microsoft.public.windows.inetexplorer.ie6.browser)
  • Re: Web Authoring PPT for Firefox Viewing
    ... but if you right click on the white bar at the bottom ... and select "This Frame"> Open Frame in New Window, ... > bottom of the browser window do not load in firefox. ...
    (microsoft.public.powerpoint)
  • Error ON Page
    ... a brief flash of a window trying to open, ... bottom of the browser window shows a yellow triangle with ... desktop computer. ...
    (microsoft.public.windows.inetexplorer.ie6.browser)