Want to remove img-border w/ xhtml, not html

[Russell Hoover]

I want to make sure that no border (around a specific small "blog-button"
image) ever appears in FF or IE, or any other browswer. I couldn't seem do
it with xhtml, so I reverted to

border="0"

inside the "img" tag. This of course does not validate as xhtml. it does
what I want it to do (gets rid of the border, in both browsers), but I want
all my code to be validated, well-formed xhtml.

How might I do this correctly using either xhtml or css?

The image in question is at <http://rjbox.net, about halfway down the
page.

The code in question is here:

99 Should you happen to agree with this you&rsquo;ll appreciate the
100 philosophy over at <a href="http://no-www.org"><img
101 src="http://no-www.org/images/blog-button.gif"
102 alt=" No-www.org "
103 title=" No-www.org "
104 border="0" /></a: “Succinctl y, use of the www subdomain is
105 redundant and time consuming to communicate. The internet, media, and
106 society are all better off without it.”&nbsp;<br /><br />

--
// [e-mail] //

[Spartanicus]

John Hosking <Jo**@DELETE.Ho sking.name.INVA LIDwrote:

[good advice snipped]

>Maybe I also be so bold as to offer a few other comments? Since you're
already styling (and you seem to care so much about "good XHTML"), get
rid of the extra <brtags everywhere.

Consecutive line break tags are always a bad idea, but there are
occasions where a single line brake tag is appropriate.

>First of all, they are not XHTML
either: you need to close all elements, here with <br/>.

Indeed, although when the document is served as text/html as the OP is
allegedly doing the advice in appendix C should be followed by inserting
a space: <br />.

>On all your images, you can apply an id and then style the dimensions.
Replace height="37" width="90" with CSS:
#vimimg { height:37px; width:90px; }

There should only be one instance of a given id per document, class
would be the thing to use for such an occasion. It should also be noted
that since CSS should be considered 100% optional, the functionality
(preventing unnecessary reflows) offered by providing the dimensions
means that usually the dimension should preferably be specified in the
markup.

>I believe &nbsp; is not valid XHTML. Check the W3C docs.

Perfectly valid, but indeed much abused.

--
Spartanicus

[John Hosking]

Spartanicus wrote:

John Hosking <Jo**@DELETE.Ho sking.name.INVA LIDwrote:

>... get rid of the extra <brtags everywhere.

Consecutive line break tags are always a bad idea, but there are
occasions where a single line brake tag is appropriate.

A good expansion of what I meant when I said "extra". The vast majority
of the <br>s in the source were in strings of three or more (up to
*five*). A couple of single instances were used as padding in an <h2>
element. Only one single-instance <brthere really qualified as
appropriate, IMO.

>

>>First of all, they are not XHTML
either: you need to close all elements, here with <br/>.

Indeed, although when the document is served as text/html as the OP is
allegedly doing the advice in appendix C should be followed by inserting
a space: <br />.

Yes, right.

>

>>On all your images, you can apply an id and then style the dimensions.
Replace height="37" width="90" with CSS:
#vimimg { height:37px; width:90px; }

There should only be one instance of a given id per document, class
would be the thing to use for such an occasion.

The rule you mention is right, but I saw that his images are several
different sizes. I didn't want to mention a class, because then he'd be
confused. ;-) I should maybe have said, "On each of your uniquely-sized
images, apply an id, for all of the common-sized images, a class..."

It should also be noted
that since CSS should be considered 100% optional, the functionality
(preventing unnecessary reflows) offered by providing the dimensions
means that usually the dimension should preferably be specified in the
markup.

Yes, this *should* be noted. It's a problem. Although for this
particular page, there wouldn't be that much reflowing, would there? Or
would that wreak havoc anyway with screen readers?

--
John

[Andy Dingley]

Russell Hoover wrote:

I reverted to border="0" inside the "img" tag. This of course does not validate as xhtml.

It would validate fine as XHTML. It's invalid because it's under a
Strict doctype, whether that's XHTML or HTML. It would still be valid
under XHTML Transitional.
First of all, use HTML. rather than XHTML. XHTML gains you nothing.
It's also harder to use correctly.

You're not using XHTML anyway, you're using Appendix C XHTML instead --
authoring it as XHTML and then sending it out as HTML, where it's
treated by the browsers as broken but auto-fixable HTML. This is better
than using "pure" XHTML, which just fails to work completely for a
significant number of browsers. However you're making life hard for
yourself, compared to HTML.

In particular, lose the following
<?xml version="1.0" encoding="utf-8"?>

and
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

I'd also note that the markup itself is bogus (valid, but badly
structured). If your code is still using repeated
<br /><br /to control layout, then the site _really_ isn't in a state
to benefit from XHTML.
To return to your stated question, you have a couple of options
regarding the "border" issue:

- Drop back to a Transitional doctype and keep "border" as an
attribute. This is a pragmatic fix to make your page valid for least
effort. If that's all you need, then do just this.

- Switch to controlling your borders through CSS. This is a better
approach for any long-term maintenance of the page. You'll probably use
a selector and rule a bit like this:
a img { border: none; }

You might find it useful to use a class attribute too, if you only
wanted this behaviour in a few places, not for every linked image.

[Russell Hoover]

On 15 Jan 2007 03:32:54 -0800, Andy Dingley <di*****@codesm iths.comwrote:

>
It would validate fine as XHTML. It's invalid because it's under a
Strict doctype, whether that's XHTML or HTML. It would still be valid
under XHTML Transitional.

Thanks to all who commented. Clearly I have a number of fundamental issues
to resolve. I'm 50 pages into the O'Reilly CSS guide and my site is on
hold til I get a better grasp of how to proceed.

[Andy Dingley]

Russell Hoover wrote:

I'm 50 pages into the O'Reilly CSS guide and my site is on
hold til I get a better grasp of how to proceed.

I'm not sure the O'Reilly will help! There's a shortage of good HTML
/ CSS tutorials that teach _good_ style, as opposed to merely
annotating the spec. O'Reilly's (animal engraving covers) aren't one of
them. However their "Head First HTML & CSS" is a good one and I'd
strongly recommend it.

This stuff isn't hard to teach or to understand, but most people just
come into it from the wrong direction, read the wrong book and then
find themselves knowing details but not the big picture. Then they show
up here and wonder why their sites get shredded.

[Roy A.]

Andy Dingley skrev:

Russell Hoover wrote:

I'm 50 pages into the O'Reilly CSS guide and my site is on
hold til I get a better grasp of how to proceed.

I'm not sure the O'Reilly will help! There's a shortage of good HTML
/ CSS tutorials that teach _good_ style, as opposed to merely
annotating the spec. O'Reilly's (animal engraving covers) aren't one of
them. However their "Head First HTML & CSS" is a good one and I'd
strongly recommend it.

This stuff isn't hard to teach or to understand, but most people just
come into it from the wrong direction, read the wrong book and then
find themselves knowing details but not the big picture. Then they show
up here and wonder why their sites get shredded.

Did you mean "Head First HTML with CSS & XHTML"?

[Andy Dingley]

Roy A. wrote:

Did you mean "Head First HTML with CSS & XHTML"?

That's the one. It's particularly good on how it treats XHTML. It
mentions it (because people buying books look for it) and then tells
you exactly why you shouldn't be using it.

[Roy A.]

Andy Dingley skrev:

Roy A. wrote:

Did you mean "Head First HTML with CSS & XHTML"?

That's the one. It's particularly good on how it treats XHTML. It
mentions it (because people buying books look for it) and then tells
you exactly why you shouldn't be using it.

And why shouln't you be using XHTML? If served properly, it should be
okey.

[Andy Dingley]

Roy A. wrote:

And why shouln't you be using XHTML? If served properly, it should be
okey.

Because it fills newsgroup archives with stuff that you clearly didn't
bother searching for before.

[Roy A.]

Andy Dingley skrev:

I'm 50 pages into the O'Reilly CSS guide and my site is on
hold til I get a better grasp of how to proceed.

I'm not sure the O'Reilly will help! There's a shortage of good HTML
/ CSS tutorials that teach _good_ style, as opposed to merely
annotating the spec. O'Reilly's (animal engraving covers) aren't one of
them. However their "Head First HTML & CSS" is a good one and I'd
strongly recommend it.

If you are using HTML 4.01 and want to validate your document, you may
want something before the head element. "Head First HTML & CSS" may be
a good book (I say "may" because av haven't read it), but I wouldn't
throw away my other books. O'Reilly has many good books, with or
without animals on the front cover. And I would think other publishers
also could offer some help.