473,626 Members | 3,289 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

They just don't work

"Now is the time for all good web developers to use stylesheets".

Hmm OK, so I start this commercial site design with the express intent
of using CSS entirely. (Something I haven't attempted in about 3 years
since I last wasted my time trying to get it to work).

The site layout is intended to look (nearly precisely) like this from
the CSS-2 spec:

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?

Wrong.

IE doesn't place 'main' correctly, and leaves ugly margins. The latter
was easily resolvable with body { margin: 0px; } - the former is a big
headache.

Netscape (and Firebird). Hmmm looks OK... that is, until you fill the
'main' <div> with _actual_ content.

Netscape cuts off the overflow lines, denying your opportunity to read
the full page. IE behaves more like you expect, expanding main and
dropping the footer to cope. So the headache is there in both and
different in both.

Never mind - there must be a reasonably simple way to tweak the
stylesheet to work properly in both, right?

Wrong.

After 4-5 hours of attempting to resolve these issues, I gave up and
built it cross-compatible using <table>s in about 20 minutes.

No wonder CSS doesn't get used as intended... it never does what it
says on the tin. That's not the W3C's fault - just a reality that has
persisted for as many years as I have been working in IT/Web.

Prove me wrong? Can you make it work?

Here's a start...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>A frame document with CSS2</TITLE>
<STYLE type="text/css">
body {
margin: 0px;
}
#header {
position: fixed;
width: 100%;
height: 50px;
top: 0px;
right: 0px;
bottom: auto;
left: 0px;
background-color: blue;
}

#sidebar {
position: fixed;
width: 150px;
height: auto;
top: 50px;
right: auto;
bottom: 20px;
left: 0;
background-color: red;
}

#main {
position: fixed;
width: auto;
height: auto;
top: 50px;
right: 0;
bottom: 20px;
left: 150px;
background-color: green;
}

#footer {
position: fixed;
width: 100%;
height: 20px;
top: auto;
right: 0px;
bottom: 0px;
left: 0px;
background-color: yellow;
}
</STYLE>
</HEAD>
<BODY>
<DIV id="header"> ... </DIV>
<DIV id="sidebar"> ... </DIV>
<DIV id="main"> ... </DIV>
<DIV id="footer"> ... </DIV>
</BODY>
</HTML>

/k1
Jul 20 '05 #1
40 3106
komone wrote:
http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?
Wrong, you have to invest time and effort to learn CSS and how to use
it, and then there's the browser bugs and shortcomings to learn.
Prove me wrong? Can you make it work?


Sure, but you need to learn how to fish for yourself. CSS isn't easy,
don't start whining if you can't get something to work immediately.

--
Spartanicus
Jul 20 '05 #2
komone wrote:
"Now is the time for all good web developers to use stylesheets".
Correct, in fact, they should have started earlier.

Hmm OK, so I start this commercial site design with the express intent
of using CSS entirely. (Something I haven't attempted in about 3 years
since I last wasted my time trying to get it to work).
If you don't learn about stuff, you won't succeed. Read this:
<http://www.zeldman.com/dwws/>

The site layout is intended to look (nearly precisely) like this from
the CSS-2 spec:

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?

Wrong.
Correct. IE doesn't support fixed positioning (without hacks)

IE doesn't place 'main' correctly, and leaves ugly margins. The latter
was easily resolvable with body { margin: 0px; } - the former is a big
headache.

Netscape (and Firebird). Hmmm looks OK... that is, until you fill the
'main' <div> with _actual_ content.

Netscape cuts off the overflow lines, denying your opportunity to read
the full page. IE behaves more like you expect, expanding main and
dropping the footer to cope. So the headache is there in both and
different in both.

Never mind - there must be a reasonably simple way to tweak the
stylesheet to work properly in both, right?

Wrong.

After 4-5 hours of attempting to resolve these issues, I gave up and
built it cross-compatible using <table>s in about 20 minutes.
Depends on your knowlodge, you will have to invest some time.

No wonder CSS doesn't get used as intended... it never does what it
says on the tin. That's not the W3C's fault - just a reality that has
persisted for as many years as I have been working in IT/Web.
blah blah blah

Prove me wrong? Can you make it work?


Nope, but I came close with fixed postioning in IE (it works in quite a
lot of browsers, but it is not the exact same layout):
<http://limpid.nl/lab/css/fixed/>
--
Anne van Kesteren
<http://www.annevankest eren.nl/>
Jul 20 '05 #3
You think 4 years isn't enough?

Truth is, you can't make it work.

And stop telling me I'm whining when I'm not. It simply won't work.

Try it.

/k1

"Spartanicu s" <me@privacy.net > wrote in message
news:lb******** *************** *********@news. spartanicus.utv internet.ie...
komone wrote:
http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?


Wrong, you have to invest time and effort to learn CSS and how to use
it, and then there's the browser bugs and shortcomings to learn.
Prove me wrong? Can you make it work?


Sure, but you need to learn how to fish for yourself. CSS isn't easy,
don't start whining if you can't get something to work immediately.

--
Spartanicus

Jul 20 '05 #4
On Tue, 11 Nov 2003, komone wrote:
IE doesn't place 'main' correctly,
"IE" comes in several versions, and has several different modes of
interpreting stylesheets, so your complaint isn't very useful.

In spite of MS's spectacular reputation for adherence to published
interworking specifications, their trend in this area is, maybe
surprisingly, towards actually doing what the spec says.
Netscape
"Netscape" have produced various browsers. The older one simply isn't
going to get any better. The current one is based on Mozilla, so if
you use it right, it's likely to aim at conforming to specifications.

I didn't see where you told us that you had validated your HTML and
successfully passed the CSS checker?
cuts off the overflow lines, denying your opportunity to read
the full page.
If you get overflow, then you're probably doing something inflexible.

Inflexible designs are no less bad in CSS than they were in
pseudo-presentational HTML/3.2(spit).
IE behaves more like you expect,
Like _I_ expect? _I_ expect some kind of attempt to conform with
specifications. If you're expecting what you got with IE, then it's
my experience that your expectations are probably at fault.
expanding main and dropping the footer to cope. So the headache is
there in both and different in both.
That sounds like a typical behaviour provoked by inflexible design.
Never mind - there must be a reasonably simple way to tweak the
stylesheet to work properly in both, right?
Oh, we're back at the "both browsers" syndrome again. I thought that
had died out by now... Don't forget Opera, Safari, MacIE, (webTV
even).
After 4-5 hours of attempting to resolve these issues, I gave up and
built it cross-compatible using <table>s in about 20 minutes.
Let's see your URLs.
Prove me wrong?


Not really. Rigid, fragile design is a problem in any language.

I'd recommend these, if you really want to get ahead.

http://www.hut.fi/u/hsivonen/standards.html
http://gutfeldt.ch/matthias/articles/doctypeswitch.html

http://w3development.de/css/hide_css_from_browsers/

But if you'd rather dig yourself back into that old HTML3.2 rut, I'm
sure you'll find plenty of company. Sturgeon's law, hmmm?
Jul 20 '05 #5
komone wrote:

No wonder CSS doesn't get used as intended... it never does what it
says on the tin. That's not the W3C's fault - just a reality that has
persisted for as many years as I have been working in IT/Web.

Prove me wrong? Can you make it work?


People that understand CSS use it because it speeds up development
time, makes a site smaller & faster, easier to maintain, easier to
target cross-media, and so on. People don't usually use CSS to prove
anything. If you don't want to use it, that's really your choice, and
have fun using table-layout, <font>, and so on. For me just looking at
a typical table-layout HTML source is enough to remind why I don't do
that.
Jul 20 '05 #6
Funny post!

OK, ahem, Mr. P. I take it you understand CSS (as I apparently don't, LOL)?
If so, show me how stupid I have been. The source is available in my
original post.

It ain't possible, y'know.

/k1
"Philipp Lenssen" <in**@outer-court.com> wrote in message
news:bo******** *****@ID-203055.news.uni-berlin.de...
komone wrote:

No wonder CSS doesn't get used as intended... it never does what it
says on the tin. That's not the W3C's fault - just a reality that has
persisted for as many years as I have been working in IT/Web.

Prove me wrong? Can you make it work?


People that understand CSS use it because it speeds up development
time, makes a site smaller & faster, easier to maintain, easier to
target cross-media, and so on. People don't usually use CSS to prove
anything. If you don't want to use it, that's really your choice, and
have fun using table-layout, <font>, and so on. For me just looking at
a typical table-layout HTML source is enough to remind why I don't do
that.

Jul 20 '05 #7
I see things haven't changed around here much.

Remember "Deep Blue" Alan, Jukka, etc.? :)
Not really. Rigid, fragile design is a problem in any language.


Interesting that you seem to believe that an almost direct copy/paste of the
CSS-2 Spec counts as "fragile design". Show me where.

And HELLO, but real people use IE or Netscape. I very, very rarely see
anything else on any site I have access logs to, and those tend to resolve
to casual visitors.

Truth is, I'd put $50 on the fact that you couldn't make it work either, for
all the huffin' and puffin' that's going on.

/k1
Jul 20 '05 #8
Steve Davis wrote:

OK, ahem, Mr. P. I take it you understand CSS (as I apparently don't,
LOL)? If so, show me how stupid I have been. The source is available
in my original post.

It ain't possible, y'know.


Maybe. Not all things are possible in popular browsers using CSS2. So
you need to use what works and stay away from what is know to break.
This takes initial learning and the W3C specs you quoted won't be of
any help in knowing what often breaks. If you show an image of what you
want to do, or describe it, maybe someone can help.
Jul 20 '05 #9
*Spartanicus* <me@privacy.net >:

Sure, but you need to learn how to fish for yourself. CSS isn't easy,
IBTD, CSS is easy. Rebuilding table or frames layouts with CSS is not,
though. Neither is knowing about all those implementation bugs.
don't start whining if you can't get something to work immediately.


Sometimes it helps, if you don't stop there.

--
"Anyone who slaps a 'this page is best viewed with Browser X' label on a
Web page appears to be yearning for the bad old days, before the Web, when
you had very little chance of reading a document written on another computer,
another word processor, or another network." Tim Berners-Lee, 1996
Jul 20 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

14
2258
by: Jim Hubbard | last post by:
http://www.eweek.com/article2/0,1759,1774642,00.asp
182
7487
by: Jim Hubbard | last post by:
http://www.eweek.com/article2/0,1759,1774642,00.asp
12
291
by: Jim Hubbard | last post by:
http://www.eweek.com/article2/0,1759,1774642,00.asp
43
5182
by: Kislay | last post by:
Which of the following is correct regarding the storage of global variables : 1. Global variables exist in a memory area that exists from before the first reference in a program until after the last reference . 2.Global variables exist in the initialized data segment .
0
8713
Oralloy
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...
0
8644
jinu1996
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...
1
8370
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
7206
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6126
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5579
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();...
0
4208
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
2632
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
1
1817
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.