|
|
|
|
Posted by Russell Hoover on January 14, 2007, 2:23 am
Please log in for more thread options
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’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> : “Succinctly, 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.” <br /><br />
--
// rj@panix.com //
|
|
Posted by John Hosking on January 14, 2007, 4:10 am
Please log in for more thread options
Russell Hoover wrote:
> 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 doesn't validate as HTML 4.01 strict either.
> 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.
When people say that here, someone invariably comes along and asks /why/
you want that. Usually the poster doesn't know, or thinks they know
(they want the most current code). Be aware (perhaps you already are)
that XHTML is not all it's cracked up (or talked up) to be. Chances are,
you really ought to be using HTML 4.01 Strict. Especially since... well,
see my comments below.
>
> How might I do this correctly using either xhtml or css?
You make it sound like they're mutually exclusive. They're not; use both.
>
> The image in question is at <http://rjbox.net> , about halfway down the
> page.
You were close; use a img { border-style: none; } . This will apply to
all the images in links rather than just the one you asked about, but
that's what this particular page specifies anyway.
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 <br> tags everywhere. First of all, they are not XHTML
either: you need to close all elements, here with <br/>. Second of all,
you don't need them and they are neither semantically correct nor
flexible. Where you want to modify spacing for an element, use a margin
(or padding) style. E.g., p {margin-bottom: 2em;}.
Of course, you'll then have to add actual <p> tags. Seems you haven't
really marked up your code at all. Most of the text is a big long DIV:
<div class="justify">. Trade that in for a <p>, add <p> and </p> tags to
deliminate paragraphs (that's what they're for), and style the <p> with
align:justify (I prefer align:left because justify can be hard to read,
but you choose. If you change your mind you can change it quickly in one
place, the .css file).
Your CSS rules for a elements should be in the order
link-visited-hover-active, otherwise the cascading won't work out the
way you probably expect. (Google for "Las Vegas Has Animals" ...)
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; }
Also, you might rethink your alt content. The titles are okay ("Built
with Vim"), but for an alt attribute I'd put something like "Vim logo"
because, well, that's what the image is. In any case, I would definitely
get rid of the extra spaces in the alt texts; I don't know how screen
readers react to them.
You have a bunch of   in your <title>. What line-breaking do you
expect the title to suffer without them? In any case, I believe
is not valid XHTML. Check the W3C docs.
Your meta tags are not self-closed as XHTML requires, either.
You're serving to all user-agents as Content-Type: text/html.
I'm more convinced than ever that you ought to just replace your doctype
with one for HTML 4.01 strict, validate it, and relax.
HTH. GL!
--
John
|
|
Posted by Jukka K. Korpela on January 14, 2007, 6:13 am
Please log in for more thread options
Scripsit John Hosking:
> You were close; use a img { border-style: none; }
Was he? After your analysis of the page, I'm reluctant to take any look at,
so I can't tell whether there's anything close to this CSS construct there.
Anyway, it does not really satisfy the request "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." Surely a user style sheet like
a img { border-style: solid !important; }
(or an equivalent browser setting) beats the rule in the author's style
sheet.
Of course, the request was utterly foolish, as is the idea of using a
button-like image instead of a link inside text. By the way, when
"successful", removing the border also removes the essential distinction
between visited and unvisited (and hovered and active) links.
--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/
|
|
Posted by Chris Morris on January 14, 2007, 7:53 am
Please log in for more thread options
> Also, you might rethink your alt content. The titles are okay ("Built
> with Vim"), but for an alt attribute I'd put something like "Vim logo"
> because, well, that's what the image is.
I'd completely disagree - if the purpose of the image (when visible)
is to say that the document is built with Vim, then the alt text
should be "Built with Vim".
If the purpose of the image is to show what the Vim logo looks like,
then "Vim logo" might be okay, though "The Vim logo is
[description]" would probably be better.
I think the general best rule for alt text is to consider what text
you *would* place there if someone had deleted all your image folders
and you wanted the page to still make sense to readers while the image
was retrieved from backups.
--
Chris
|
|
Posted by John Hosking on January 14, 2007, 8:53 am
Please log in for more thread options
Chris Morris wrote:
> John Hosking writes:
>
>>Also, you might rethink your alt content. The titles are okay ("Built
>>with Vim"), but for an alt attribute I'd put something like "Vim logo"
>>because, well, that's what the image is.
>
> I'd completely disagree - if the purpose of the image (when visible)
> is to say that the document is built with Vim, then the alt text
> should be "Built with Vim".
Okay, but you don't have to *completely* disagree. ;-)
In any case, if we go with this argument, he should put "Created with
Vim," because that is the phrase it turns out actually appears on the
image. But I started with the assumption that if the meaningful content
represented by that gif is exactly the same as the discernible text in
the image, then the gif might as well be replaced with the actual text,
"Created with Vim." But since the gif is there, it must be to catch the
eye with the graphical smoothness and worldwide recognition of the Vim
logo. Here's a compromise suggestion: alt="'Created with Vim' logo".
>
> If the purpose of the image is to show what the Vim logo looks like,
> then "Vim logo" might be okay, though "The Vim logo is
> [description]" would probably be better.
Okay, except I suppose neither of us expect anyone to care about a
design description of the logo. More likely is that the purpose is to
use the recognition value of the logo. *Most* likely is that he put the
gif on his page because he could. ;-)
>
> I think the general best rule for alt text is to consider what text
> you *would* place there if someone had deleted all your image folders
> and you wanted the page to still make sense to readers while the image
> was retrieved from backups.
>
That sounds like a good rule. My rule has been to put some clue as to
what the image *is* (without so much about why it's there). The title
attribute can provide a hint as to what the image *represents*. I'll
have to think about your rule, though. What do blind visitors want? What
do screen readers work best with?
--
John (disagreeing only *partially*, at most)
|
| Similar Threads | Posted | | Auto remove whitespace from HTML | April 14, 2008, 2:23 am |
| style to remove all styles | March 25, 2005, 5:09 am |
| How can I remove tags which have no attributes? | May 28, 2005, 6:31 pm |
| How to remove page break? | May 29, 2005, 12:53 pm |
| How do I remove frames EASILY?? | November 21, 2005, 2:03 pm |
| How to remove the spacing between | October 17, 2007, 9:09 am |
| Re: xhtml 1.0, xhtml 1.1, html 4.01, or html 5.X? -Guy Macon | July 20, 2008, 12:28 am |
| Re: xhtml 1.0, xhtml 1.1, html 4.01, or html 5.X? -Guy Macon | July 20, 2008, 1:56 am |
| Re: xhtml 1.0, xhtml 1.1, html 4.01, or html 5.X? -Guy Macon | July 21, 2008, 6:05 am |
| Re: xhtml 1.0, xhtml 1.1, html 4.01, or html 5.X? -Guy Macon | July 25, 2008, 8:57 am |
|
|
|
|
XML Sitemap