Hi there, everybody.
This here is a sample page of what appears to be a Netscape/Mozilla
positioning problem.
I posted a the problematic code down at the bottom of this message, and
you can see it in action right here: http://www.nicolaizwar.com/whatsthematterwiththis.html
The red box on the page is supposed to be in a "fixed" position, though
the problem occurs when the position is supposed to be "absolute" as
well. Now IE ignores "fixed" and scrolls anyway, but I can live with
that. In Opera 7, the site shows up exactly as I would expect and I
personally think it should (or do I actually have it wrong, and maybe
Netscape's got it right and Opera doesn't??)
The problem in Netscape 7.1 is that while the box should be positioned
50px down from the top of the page, it's actually positioned down 50px
from the next "div" containing the text (later on in several "p"s.)
For example, if I set the red box to "margin-top: 0x", it will be flush
with the following "div", not with the page.
Is that a known bug or issue? I tried Bugzilla but couldn't really find
something helpful there. What's the work around? Or does one have to
resort to tables here for positioning?
THE CODE (excerpt):
<style type="text/css">
<!--
body { margin: 0px; padding: 0px; }
#redbox { color: #CCCCCC;
margin-top: 50px; margin-left: 35px; margin-bottom: 30px;
padding: 0px; background-color: red; z-index: 100;
position: fixed; width: 600px; height: 50px;
}
-->
</style></head><body>
<div id="redbox">
Blabla blabla blabla.
</div>
<div style="position : relative; padding: 0px; margin-top: 200px;
margin-right: 15%; margin-left: 15%;">
<p>
Blablablabla
</p>
</div>
--
Nicolai Zwar -- http://www.nicolaizwar.com
"I don't post off-topic digests. I consistently ask the antagonists
what their postings have to do with classical music, which happens to be
the topic of this newsgroup."
(Dr. David J. Tholen, Astronomer, in his "Antagonist s Digest, Volume
2452972, posted in rec.music.class ical) 6  2343 
Nicolai P. Zwar wrote: Hi there, everybody.
This here is a sample page of what appears to be a Netscape/Mozilla
positioning problem.
I posted a the problematic code down at the bottom of this message, and
you can see it in action right here:
http://www.nicolaizwar.com/whatsthematterwiththis.html
The red box on the page is supposed to be in a "fixed" position, though
the problem occurs when the position is supposed to be "absolute" as
well. Now IE ignores "fixed" and scrolls anyway, but I can live with
that. In Opera 7, the site shows up exactly as I would expect and I
personally think it should (or do I actually have it wrong, and maybe
Netscape's got it right and Opera doesn't??)
The problem in Netscape 7.1 is that while the box should be positioned
50px down from the top of the page, it's actually positioned down 50px
from the next "div" containing the text (later on in several "p"s.)
For example, if I set the red box to "margin-top: 0x", it will be flush
with the following "div", not with the page.
Is that a known bug or issue? I tried Bugzilla but couldn't really find
something helpful there. What's the work around? Or does one have to
resort to tables here for positioning?
THE CODE (excerpt):
<style type="text/css">
<!--
body { margin: 0px; padding: 0px; }
#redbox { color: #CCCCCC;
margin-top: 50px; margin-left: 35px; margin-bottom: 30px;
padding: 0px; background-color: red; z-index: 100;
position: fixed; width: 600px; height: 50px;
}
-->
</style></head><body>
<div id="redbox">
Blabla blabla blabla.
</div>
<div style="position : relative; padding: 0px; margin-top: 200px;
margin-right: 15%; margin-left: 15%;">
<p>
Blablablabla
</p>
</div>
Well, I found a possible solution for this: it's to add an empty div,
give it the top margin you want, and the red box will be flush with that
div. Only Netscape/Mozilla seem to need this, though fortunately this
doesn't interfere with the other browsers. Odd...
--
Nicolai Zwar -- http://www.nicolaizwar.com
"I don't post off-topic digests. I consistently ask the antagonists
what their postings have to do with classical music, which happens to be
the topic of this newsgroup."
(Dr. David J. Tholen, Astronomer, in his "Antagonist s Digest, Volume
2452972, posted in rec.music.class ical)
"Nicolai P. Zwar" <NP****@bigfoot .com> wrote in
news:bu******** **@online.de: #redbox { color: #CCCCCC;
margin-top: 50px; margin-left: 35px; margin-bottom: 30px;
padding: 0px; background-color: red; z-index: 100;
position: fixed; width: 600px; height: 50px;
}
While you've specified fixed positioning, you haven't specified any of the
four possible offsets (top, right, bottom, left) so they all default to
"auto" which leaves you at the mercy of browser layout algorithms. I'm
going to guess that you actually want to put it 50px down from the top and
35px to the right of the left edge; in that case you should be using
offsets rather than margins for top and left.
Eric Bohlman wrote: #redbox { color: #CCCCCC;
margin-top: 50px; margin-left: 35px; margin-bottom: 30px;
padding: 0px; background-color: red; z-index: 100;
position: fixed; width: 600px; height: 50px;
}
While you've specified fixed positioning, you haven't specified any of the
four possible offsets (top, right, bottom, left) so they all default to
"auto" which leaves you at the mercy of browser layout algorithms. I'm
going to guess that you actually want to put it 50px down from the top and
35px to the right of the left edge; in that case you should be using
offsets rather than margins for top and left.
You are absolutely right, Eric. 8-) Too many hours in front of the
screen, I guess. In fact, in the first pages I coded I had specified the
top position _and_ the margins, then somehow via copy and paste I must
have lost the offsets and didn't notice it, because Opera and IE
continued to show the same thing. This answer is the tree I couldn't see
because of the forest. I don't know how many more hours I would have
lost looking for what is the most obvious answer; now that I re-inserted
the offsets, everything's back to normal. Thanks!
--
Nicolai Zwar -- http://www.nicolaizwar.com
"I don't post off-topic digests. I consistently ask the antagonists
what their postings have to do with classical music, which happens to be
the topic of this newsgroup."
(Dr. David J. Tholen, Astronomer, in his "Antagonist s Digest, Volume
2452972, posted in rec.music.class ical)
"Nicolai P. Zwar" <NP****@bigfoot .com> wrote in
news:bu******** **@online.de: While you've specified fixed positioning, you haven't specified any
of the four possible offsets (top, right, bottom, left) so they all
default to "auto" which leaves you at the mercy of browser layout
algorithms. I'm going to guess that you actually want to put it 50px
down from the top and 35px to the right of the left edge; in that
case you should be using offsets rather than margins for top and
left.
You are absolutely right, Eric. 8-) Too many hours in front of the
screen, I guess. In fact, in the first pages I coded I had specified
the top position _and_ the margins, then somehow via copy and paste I
must have lost the offsets and didn't notice it, because Opera and IE
continued to show the same thing. This answer is the tree I couldn't
see because of the forest. I don't know how many more hours I would
have lost looking for what is the most obvious answer; now that I
re-inserted the offsets, everything's back to normal. Thanks!
Let me guess: you stared at your stylesheet for hours and actually saw
offset specifications even though you had dropped them. Welcome to
"psychologi cal set," the mind's ability to see what it's expecting to see
rather than what the senses actually perceive. Douglas Adams based his
concept of the "SEP (Someone Else's Problem) field" on psychological set.
Anyone who's ever debugged a program or proofread a manuscript has had the
experience of staring at their work and seeing what they meant to write
rather than what they actually did write. Gerald Weinberg had much to say
about psychological set in his classic _The Psychology of Computer
Programming_; as an example, he pointed out that any programming who names
a variable "ST0P" (yes, that's a zero) is setting himself up for failure.
Psychological set is actually a consequence of the way our brains try to
minimize the demands on our attention mechanism (it's no accident that we
speak of "paying" attention; attention is a scarce resource in our brains'
"economy"). It's what's called a "heuristic" ; a process that gives the
correct results *most* of the time, but sometimes fails. It relieves us
from the need to consciously attend to all the minute details of everyday
life, but it leads to mistakes in the (relatively small) class of human
endeavors that require extreme precision. It explains why, for example,
someone else who looks at your code (and doesn't fully know what you
intended to write) can instantly spot errors that you can't.
Psychological set is one of the reasons why it's so important to use
validators (though in your case, a validator couldn't have caught your
mistake). A validator, being a mechanical process with a level of
"intelligen ce" that could easily be beat by a moderately retarded five-
year-old, doesn't make any assumptions; it just literally follows a bunch
of simple rules. And therefore it's too stupid to experience psychological
set, which means that it will catch a lot of common mistakes.
Eric Bohlman wrote: Let me guess: you stared at your stylesheet for hours and actually saw
offset specifications even though you had dropped them.
I don't know whether I actually "saw" them, it simply didn't even occur
to me at all that they might not be there (especially not since IE and
Opera put the box where I wanted it anyway, even without offset specs).
This was way too easy... so I assumed completely different reasons. :)
Kinda like checking the electronic of your car when the problems is a
lack of fuel.
Welcome to
"psychologi cal set," the mind's ability to see what it's expecting to see
rather than what the senses actually perceive. Douglas Adams based his
concept of the "SEP (Someone Else's Problem) field" on psychological set.
Anyone who's ever debugged a program or proofread a manuscript has had the
experience of staring at their work and seeing what they meant to write
rather than what they actually did write. Gerald Weinberg had much to say
about psychological set in his classic _The Psychology of Computer
Programming_; as an example, he pointed out that any programming who names
a variable "ST0P" (yes, that's a zero) is setting himself up for failure.
Psychological set is actually a consequence of the way our brains try to
minimize the demands on our attention mechanism (it's no accident that we
speak of "paying" attention; attention is a scarce resource in our brains'
"economy"). It's what's called a "heuristic" ; a process that gives the
correct results *most* of the time, but sometimes fails. It relieves us
from the need to consciously attend to all the minute details of everyday
life, but it leads to mistakes in the (relatively small) class of human
endeavors that require extreme precision. It explains why, for example,
someone else who looks at your code (and doesn't fully know what you
intended to write) can instantly spot errors that you can't.
Psychological set is one of the reasons why it's so important to use
validators (though in your case, a validator couldn't have caught your
mistake). A validator, being a mechanical process with a level of
"intelligen ce" that could easily be beat by a moderately retarded five-
year-old, doesn't make any assumptions; it just literally follows a bunch
of simple rules. And therefore it's too stupid to experience psychological
set, which means that it will catch a lot of common mistakes.
Good ol' Doug... why did he have to go so young...
But indeed, I already had checked the (shortened) stylesheet via
validator and it was perfectly happy with it. Nope, it said. No
problems. Keep goin', chap! Box here, box there, looks good to me either
way. Next problem? Validators lack taste.
--
Nicolai Zwar -- http://www.nicolaizwar.com
"I don't post off-topic digests. I consistently ask the antagonists
what their postings have to do with classical music, which happens to be
the topic of this newsgroup."
(Dr. David J. Tholen, Astronomer, in his "Antagonist s Digest, Volume
2452972, posted in rec.music.class ical)
"Nicolai P. Zwar" <NP****@bigfoot .com> wrote in
news:bu******** **@online.de: Good ol' Doug... why did he have to go so young...
Indeed. He posessed one of the most finely-calibrated bullshit detectors
known to mankind. Am I the only one who thinks that J.K. Rowling picked up
a few of his sensibilities and kept them alive (admittedly, they could
have both gotten it from P.G. Wodehouse)?
But indeed, I already had checked the (shortened) stylesheet via
validator and it was perfectly happy with it. Nope, it said. No
problems. Keep goin', chap! Box here, box there, looks good to me
either way. Next problem? Validators lack taste.
He who develops a validator with good taste will win a Nobel Prize for
aesthetics. Seriously, the ability to pick up correct syntax doesn't
extend to the ability to pick up correct semantics; witness Lewis Carroll's
"Jabberwock y." (I suppose if CSS were expressed in XML, something like Rick
Jelliffe's Schematron could pick up constraints like "any positioned
element must specify at least one offset). This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics | |
by: Piotr Wolski |
last post by:
how to make my page that it was correct with every browser standard?
for example when i change HTML's table size it has no effect when i see
it under mozilla and has effect under Internet explorer-does anyone know
how to solve that problem??
|
by: Sector024 Media |
last post by:
My question is why netscape doesn't seem to support a style definition in a
table?
I have my pages as valid xhtml1.0, and still netscape is not folowing
orders..
<table style="text-align:center;">
<tr>
<td> </td>
</tr>
|
by: Aaron |
last post by:
Hi,
In the following code, everything looks fine on Explorer, but on Netscape
there is a large white gap between the 'top' section and the 'bottom menu'
section. I've set the style 'div img {display:block}' already to get rid on
Netscape's problem with putting space around images, but it does nothing for
this. Setting margins and padding to zero do nothing also. Here's the code:
|
by: SWE |
last post by:
Hi all,
I'm new to using style sheets for laying out my web pages. I have a
horizontal navigation menu that is split into two sections - three buttons
on the left and a submenu on the right that changes depending on which
button you select. The menu looks good in Internet Explorer 6, but in
Mozilla Firefox 0.8 and Netscape Navigator 7.1 the submenu positions itself
further down the page instead of right next to the buttons. I don't know...
|
by: Ben |
last post by:
I have a page (www.eastex.net/ben/NewETN/index3.asp) that displays OK in IE,
but not in Netscape. I used a combination of padding-top and height
attributes to get a total height on four cells. Netscape seems to not
respect the padding-top, and only goes by the height, resulting in the cells
being too short.
What options do I have in CSS? I would like to be able to specify the
height by using a definite attribute (I thought height was...
| | |
by: Jonas Smithson |
last post by:
Hello all,
I have an absolute positioned parent div, and nested inside it is an
absolute positioned child div -- I mean the div *code* is nested
inside, but the child is physically positioned so that it's completely
outside the parent div (to the left of its parent, in a left-side
margin area). The child div contains hyperlinks.
Explorer 6 (on Windows) has no problem with this. However, in Netscape
6, the links are unclickable. I...
|
by: red |
last post by:
How do I center two side by side divs ?
I've been writing css pages for a while but there's one thing tha still
eludes me.
I can center a div with margin auto.
I can place two divs side by side with float.
But I can't center two side by side divs.
If I float them and give them auto margins, the auto margins are ignored.
If I wrap the two floated divs in another div, the two divs have no
|
by: Darren |
last post by:
Hi. I have a javascript menu system which uses the "elementFromPoint"
function. However Netscape/Mozilla doesn't recognise this function. Does it
have an equivilent?
Thanks
--
Darren
|
by: silverbob |
last post by:
I have been writing web pages for years using these attributes to the
body tag:
<body bgcolor=#FFFFFF marginwidth=0 leftmargin=0 marginheight=0
topmargin=0>
I'm now attempting to bring my pages into compliancy with the latest
css based standards. I have removed the bgcolor, leftmargin, and
topmargin attributes in favor of style sheet properties:
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it.
First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
| | |
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols.
I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| | |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| | |
