W3C home > Mailing lists > Public > www-style@w3.org > October 2001

position: fixed [Re: How is it possible to devise such a feeble system?]

From: Vadim Plessky <lucy-ples@mtu-net.ru>
Date: Thu, 25 Oct 2001 16:18:45 +0000
To: Håkon Wium Lie <howcome@opera.com>
Cc: www-style@w3.org
Message-Id: <20011025121326.4B80A23158@hueymiccailhuitl.mtu.ru>
On Wednesday 24 October 2001 23:51, Håkon Wium Lie wrote:
|   Also sprach Andrew McFarland:
|    > What you are wanting to do is center the text vertically in the middle
|    > of the screen (or window). I don't think CSS `knows' what size the
|    > screen (or window) is.
|
|   MOst of the CSS formatting model deals with elements (and their
|   associated boxes) and not the viewport (a.k.a. window). There is one
|   exeption, though. "Fixed positioning" lets you place elements w.r.t
|   the viewport. Here is a simple example on how to "center" content in
|   the window:
|
[...]
|
|   "Fixed positioning is supported by Opera and Mozilla.
|

Hmmm. Please try example below (it's based on your example, with some 
modifications to improove visual perception)
I tested it in Opera5/Linux and Mozilla 0.9.1/Linux.
Neither Opera nor Mozilla could: 
a) center text horizontally
b) center DIV block vertically
c) paint background for DIV block in light-gray - rgb (211,211,211)
d) paint border-top and border-bottom

So, statement that "Fixed positioning is supported by Opera and Mozilla" is 
somewhat too strong. 'position: fixed' doesn't work on this example in Opera 
and Mozilla.  
In contrast, my Konqueror 2.2.1 displays this example pretty well.
See screenshot attached.
-----------------------------------------------------
<HTML>
  <STYLE>
  #foo {
    position: fixed;
    top: 40%;
    height: 20%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border-top: 2px solid lime;
    border-bottom: 2px solid lime;
    border-left: 0px;
    border-right: 0px;
    background: rgb(211,211,211);
    color: navy;
  }
  body { margin: 0; padding: 0 }
</STYLE>
<BODY>
  <DIV id="foo">
  bar
  </DIV>
</BODY>
-------------------------------------------------------

Mozilla, Opera developers: can you comment on this?

|   It's not true centering vertically since the height DIV's content
|   isn't taken into the calulation.

Pardon?
|
|   -h&kon
|                 Håkon Wium Lie                          cto °þe®ª
|   howcome@opera.com                  http://people.opera.com/howcome

-- 

Vadim Plessky
http://kde2.newmail.ru  (English)
33 Window Decorations and 6 Widget Styles for KDE
http://kde2.newmail.ru/kde_themes.html
KDE mini-Themes
http://kde2.newmail.ru/themes/


screenshot of Konqueror 2.2.1, rendering attached testcase
(image/png attachment: position-fixed-Konq22.png)

Received on Thursday, 25 October 2001 08:13:58 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:11 GMT