473,322 Members | 1,620 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,322 software developers and data experts.

Multiple ID instances

qwe
More curiosity than a real problem, but...

I've been abusing HTML ID attributes slightly.

..box {
margin: 10px;
}

#red {
background-color: #ff0000;
}

#green {
background-color: #00ff00;
}

<div class="box" id="red"></div>
<div class="box" id="green"></div>
<div class="box" id="red"></div>

To get a red box followed by a green box and another red box.

HTML validators complain because id attributes are supposed to be unique,
but the big three browser engines let me get away with it.

What's the "right" way to do this? Should I just have boxred and boxgreen
classes? That seems a little wasteful when I only want to change one
property.

Jul 20 '05 #1
12 15058
qwe <_1*******@yahoo.com> wrote:

I've been abusing HTML ID attributes slightly.

.box {
margin: 10px;
}

#red {
background-color: #ff0000;
}

#green {
background-color: #00ff00;
}

<div class="box" id="red"></div>
<div class="box" id="green"></div>
<div class="box" id="red"></div>

To get a red box followed by a green box and another red box.

HTML validators complain because id attributes are supposed to be unique,
but the big three browser engines let me get away with it.
They let you get away with all sorts of things, but will they continue
to do so in the next version?
What's the "right" way to do this? Should I just have boxred and boxgreen
classes? That seems a little wasteful when I only want to change one
property.


Change red and green to classes and apply multiple classes to the
divs. Some older browsers will not apply either class.

<div class="box red"></div>
<div class="box green"></div>
<div class="box red"></div>

Or use classes as you suggest but give the shared and differeing
properties in different styles e.g.

..boxred, .boxgreen { margin: 10px; }
..boxred { background-color: #ff0000; }
..boxgreen { background-color: #00ff00; }

Or set the background-color of .box to red and just have #green
override it in the one exception.
<div class="box"></div>
<div class="box" id="green"></div>
<div class="box"></div>

The best solution will depend on you actual situation rather than on
the simplified examples being used here.

BTW you should always set a color when you set a background-color.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 20 '05 #2
qwe
On Tue, 05 Aug 2003 07:52:05 +0100, Steve Pugh <st***@pugh.net> wrote:
They let you get away with all sorts of things, but will they continue
to do so in the next version?
Yes; as long as there is competition in the market, the browser that is
least strict will have an edge.
.boxred, .boxgreen { margin: 10px; }
.boxred { background-color: #ff0000; }
.boxgreen { background-color: #00ff00; }


I think that's exactly what I was looking for... thanks. The other examples
were useful too.

Jul 20 '05 #3
qwe <_1*******@yahoo.com> wrote:
.box {
margin: 10px;
}

#red {
background-color: #ff0000;
}

#green {
background-color: #00ff00;
}

<div class="box" id="red"></div>
<div class="box" id="green"></div>
<div class="box" id="red"></div>

To get a red box followed by a green box and another red box.

HTML validators complain because id attributes are supposed to be unique,
but the big three browser engines let me get away with it.

What's the "right" way to do this? Should I just have boxred and boxgreen
classes? That seems a little wasteful when I only want to change one
property.


..box{margin:10px}
..red{background-color:#ff0000}
..green{background-color:#00ff00}

<div class="box red"></div>
<div class="box green"></div>
<div class="box red"></div>
Headless

--
Email and filter list: http://www.headless.dna.ie/usenet.htm
Jul 20 '05 #4
qwe <_1*******@yahoo.com> writes:
On Tue, 05 Aug 2003 07:52:05 +0100, Steve Pugh <st***@pugh.net> wrote:
They let you get away with all sorts of things, but will they continue
to do so in the next version?


Yes; as long as there is competition in the market, the browser that is
least strict will have an edge.


Yes, but which edge? Guessing the meaning of invalid code *wrongly*
isn't going to do much for their reputation as a reliable UA.

--
Chris
Jul 20 '05 #5
On Tue, Aug 5, Chris Morris inscribed on the eternal scroll:
Yes, but which edge? Guessing the meaning of invalid code *wrongly*
isn't going to do much for their reputation as a reliable UA.


The problem here is that the kind of author who relies on browser
guessing will optimise their page for the browser that does the most
guessing (YKWIM), and then complain about all the others being
"wrong".

--
"In the hardest of cases, I show them the W3C membership list: as
soon as the customer sees that MS is a member, then everything the
W3C says is good, and typically they even demand conformance with
W3C written into the contract" - (Matthias Esken, freely translated)
Jul 20 '05 #6
qwe <_1*******@yahoo.com> writes:
On Tue, 5 Aug 2003 08:01:05 +0000 (UTC), "Jukka K. Korpela"
<jk******@cs.tut.fi> wrote:
Really? Meanwhile on Earth, the versions of the most popular browsers have
been getting _stricter_ in the last few years, both as regards to HTML and
Yeah, I thought that would get a bite.

Look at it like this. You're an end-user. Browser A renders your favourite
site perfectly, Browser B shows you a blank page. Which browser will you
use?


Given that I switch browser based on what machine I'm currently using,
I'd probably never have chosen it as a favourite site.
(Example off the top of my head: Netscape 4 is really picky about </td>
tags. Mozilla 1 will correctly render the page if you ignore them.)

<table border="1">
<tr><td>1<td>3<tr><td>2<td>4
</table>


http://www.w3.org/TR/html401/struct/....html#h-11.2.5

End tags for <td> and <tr> are optional in HTML 4. Netscape 4 ignores
the spec and goes wrong, Mozilla 1 follows the spec and gets it right.

Your point?

--
Chris
Jul 20 '05 #7
qwe wrote:
HTML validators complain because id attributes are supposed to be unique,
but the big three browser engines let me get away with it.

What's the "right" way to do this? Should I just have boxred and boxgreen
classes? That seems a little wasteful when I only want to change one
property.


Elements can have multiple classes.

class="box red"

Which would match .red { } AND .box { }

--
David Dorward http://david.us-lot.org/
Which is stupider: Pop-up ads claiming they'll stop spam, or spam claiming
it'll stop pop-up ads? -- Dork Tower
Jul 20 '05 #8
qwe <_1*******@yahoo.com> writes:
On 05 Aug 2003 10:47:13 +0100, in comp.infosystems.www.authoring.stylesheets
you wrote:
qwe <_1*******@yahoo.com> writes:
(Example off the top of my head: Netscape 4 is really picky about </td>
tags. Mozilla 1 will correctly render the page if you ignore them.)
http://www.w3.org/TR/html401/struct/....html#h-11.2.5

End tags for <td> and <tr> are optional in HTML 4. Netscape 4 ignores
the spec and goes wrong, Mozilla 1 follows the spec and gets it right.


Hmm... you could be right. What about XHTML 1.0? I was under the impression


Obviously they're both required in XHTML 1.0, but since Netscape 4
predates XHTML this comparison is beginning to get silly.

To bring things slightly back on topic with stylesheets, closing all
non-empty elements is very good to avoid Netscape 4 CSS confusion.
it was an XML application, though I confess I didn't test Mozilla's reaction
with the correct doctype in place. One moment...
XML Parsing Error: mismatched tag. Expected: </td>.
Location: http://dinopsis/~cim/xhtmltest
Line Number 9, Column 8:
</table>
-------^

Of course, that was sending it with the application/xhtml+xml content-type.

Sending it as text/html it isn't surprising it treats it as HTML, most
browsers not going to the trouble of downloading (or otherwise
obtaining) the DTD and performing a validation before displaying the
page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
<table border="1">
<tr><td>1<td>3
<tr><td>2<td>4
</table>
</body>
</html>

renders as (un?)expected in Mozilla 1.3, IE 6.02 and Opera 7.0, all on Win.
Sent as application/xhtml+xml, IE offered to save
it to disk, and Opera did something similar to Mozilla (except the
error report was a little more helpful).
Possibly I'm missing a "be really anal" switch in one or another of them,
but even if it exists then it's off by default and my point still stands -
browser vendors place "what the author meant to say" over "what the author
really said".
TelepathicML, excellent. It's when they get it wrong that the
problems come in. (previous comments about a certain application
'training' authors for its bugs accepted, though)
Now I come to think about it, that may even be the Right Thing
from a usability POV - hmm.
There is a principle of 'be conservative in what you send, be liberal
in what you accept', but the problem is that if you're the wrong
liberal things get even worse than if you'd rejected it initially.
I just don't see a time when a major browser will refuse to render <br> or
<hr> in an XHTML doc.


XML Parsing Error: mismatched tag. Expected: </br>.
Location: http://dinopsis/~cim/xhtmltest
Line Number 9, Column 3:

The future is now?

--
Chris
Jul 20 '05 #9
qwe
On 05 Aug 2003 12:15:30 +0100, Chris Morris <c.********@durham.ac.uk> wrote:
Obviously they're both required in XHTML 1.0, but since Netscape 4
predates XHTML this comparison is beginning to get silly.
Yup.
Sending it as text/html it isn't surprising it treats it as HTML, most
browsers not going to the trouble of downloading (or otherwise
obtaining) the DTD and performing a validation before displaying the
page.
Interesting. I suppose there are no hard and fast rules about what to do
when the content-type and doctype disagree, because they're in seperate
specs.
There is a principle of 'be conservative in what you send, be liberal
in what you accept', but the problem is that if you're the wrong
I was thinking of the law of least surprise, but that fits too.
liberal things get even worse than if you'd rejected it initially.


Unless you hold 90% of the market, of course... then you become a de facto
standard.

The rest snipped because I think you've proved your points pretty
succesfully.

Jul 20 '05 #10
qwe <_1*******@yahoo.com> writes:
On 05 Aug 2003 12:15:30 +0100, Chris Morris <c.********@durham.ac.uk> wrote:
Sending it as text/html it isn't surprising it treats it as HTML, most
browsers not going to the trouble of downloading (or otherwise
obtaining) the DTD and performing a validation before displaying the
page.


Interesting. I suppose there are no hard and fast rules about what to do
when the content-type and doctype disagree, because they're in seperate
specs.


Try Content-type: text/plain for an example.

Any standards-compliant browser will go for the content type and if
the text document sent happens to contain a doctype and some HTML
elements, so what. The HTTP rules say content-type headers are the
ones to go for in determining what the document is.

Any horribly broken operating system component will go for the fact
that it 'looks a bit like a HTML document' over the content type, and
all sorts of things can go interestingly wrong, of course.

--
Chris
Jul 20 '05 #11
On Tue, Aug 5, Chris Morris inscribed on the eternal scroll:
Any horribly broken operating system component will go for the fact
that it 'looks a bit like a HTML document' over the content type, and
all sorts of things can go interestingly wrong, of course.


As far as I could determine, it took no more than the character string
<TITLE>, close enough to the start of the text/plain document, to
throw that thing into RFC-violation mode. Absolutely no need to say
<HTML> anywhere.

I read somewhere in their KB that they claimed to have a fix for
IE5.*, but it's not installed by default: I installed it some time
back, and it didn't work.

See: http://support.microsoft.com/default...b;en-us;164672

which in mid-1999 (that was 4 years ago, right?) said:

Microsoft has confirmed this to be a problem with Microsoft Internet
Explorer version 3.0 or above. We are researching this problem and
will post new information here in the Microsoft Knowledge Base as it
becomes available.

Erm, yes. Actually, a fellow usenaut with a sense of history points
out that the vulnerability which MS were going to create several years
later, was described, and recipes given for exploiting it, in IETF
discussions long before MS decided to get involved in the Internet.

RFC2616 makes recommendations based on that earlier understanding. Yet
still MS behave as if they don't understand the problem that they've
created, and can't solve it other than by applying sticky-tape
solutions one by one as each exploit appears, rather than addressing
one of the fundamentals by implementing this mandatory requirement of
RFC2616.

Well, then there's
http://support.microsoft.com/default...;EN-US;q239750
and
http://support.microsoft.com/default...b;en-us;329661

Are they getting there? I tried IE6 and it still doesn't work,
although its wrong behaviour is slightly different from the previous
wrong behaviour. Sigh.
Jul 20 '05 #12
On Tue, 05 Aug 2003 09:32:08 +0100, qwe <_1*******@yahoo.com> wrote:
Look at it like this. You're an end-user. Browser A renders your favourite
site perfectly, Browser B shows you a blank page. Which browser will you
use?
One starts with a browser, then looks at sites. If site A is unreadable
in my browser, I go to site B instead (unless site A has some *really*
important content that I simply cannot get anywhere else - doesn't
happen often.)

(Example off the top of my head: Netscape 4 is really picky about </td>
tags. Mozilla 1 will correctly render the page if you ignore them.)

<table border="1">
<tr><td>1<td>3<tr><td>2<td>4
</table>


That's a poor example though - omission of </td> is valid, and Netscape
4 is broken. The issue here is error-correction of invalid HTML.

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/
Jul 20 '05 #13

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

Similar topics

1
by: Martin V. | last post by:
Hello, Is the multiple instances capability of SQL2K mature enough for a Production system? We're looking at upgrading our hardware but the proposed solution calls for consolidating two...
1
by: Vlad | last post by:
Is there any way to install multiple instances of the same windows service designed with VS.NET 2003? I tried copying the binaries into a separate folder and then copying registry entries for the...
11
by: Mike | last post by:
Looking to find any information on how to properly configure multiple instances of DB2. This is on Win2k db2 ver 7.2. I am basically looking for information on how the multiple instance settings...
1
by: Johan | last post by:
If a user happens to open multiple instances of her frontend, what kind of problems can occur? For example, one user reported that she was able to, once or twice, bypass the evaluation...
11
by: Clark Stevens | last post by:
I just finished a WinForms app in VB.NET. I want to allow the user to be able to run multiple instances of the program like you can with Notepad and Wordpad. The way it is now, once I run the...
10
by: John | last post by:
I currently have a Windows Service that runs Transactions that are very Processor/Memory Intensive. I have a requirement to deploy multiple instances of the Web service on the Same server. Each...
1
by: sunil | last post by:
Hello All. I have written a program as an exe that performs some kind of order processing. The program is first configured and then started manually. I have have multiple instances of this...
4
by: Mike | last post by:
Class A public objX I want to create 2 or more instances of Class A and have the same value for objX in all instances. Instance1 of Class A Instance2 of Class A Instance3 of Class A
6
by: Bugs | last post by:
Does anyone have any recommendations on the best way to create multiple instances of the same class when the final number of instances is unknown? For example, I have a class and based on some...
0
by: jigsmshah | last post by:
I have a windows service developed in C#.I am reading the connection string from an ini file and also i am reading 3 image file from the bin directory. now the new requirement is that there will be...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 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 former...

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.