Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 344
  • Last Modified:

<li> in Netscape and Non IE browsers

Hi,

On our website, when validating forms we display all the errors to the user one after the other using

<li>This is error one</li><br>
<li>This is error two</li><br>

we dont put the normal <ul> </ul> tags around the <li> tags as we dont want the lines to indent. This all works fine in IE, and the spacing between one line and the next is just the normal spacing for a <br>. However in netscape it appears like 2 <br> tags have been put it as the spacing between the two lines is massive.

Does anyone know how to get round this as this makes the pages look useless....

Thanks in advance

Al
0
higgsy
Asked:
higgsy
  • 5
  • 4
  • 2
  • +4
1 Solution
 
mrh30Commented:
First off, your page is invalid HTML if you have <li> tags that aren't within some form of list.  This is the reason that Netscape has trouble with it.

To achieve the effect you desire, you need to create the list properly, and then apply style sheeting to sort the formatting out.  I can't remember off hand which one of the box attributes you need to set to be zero in order to stop the indenting, so I've included both.  You probably only need one of them.

<ul style="margin-left: 0px; padding-left: 0px">
<li>Item 1</li>
<li>Item 2</li>
</ul>
0
 
daveroydunnCommented:
If you just remove the <br> tags you should find that there are no longer the extra spaces between the lines.
0
 
seanpowellCommented:
>>we dont want the lines to indent.

If you set the margin's on the list items as noted above - the visual result is:

This is error one
This is error two

At that point, then you may as well use the following to code the errors:

This is error one<br>
This is error two<br>

However, if the intent is to show the bullet's next to the list items, "but not have the normal indent of the bullets", than you need to adjust the margin property to suit your specific application:

<ul style="margin-left: 10px;">
<li>Item 1</li>
<li>Item 2</li>
</ul>

This gives you the bullets but without the normal indent.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
mrh30Commented:
Yep, that's true - hadn't actually ever tried it, was running on a bit of guesswork from the spec!
0
 
seanpowellCommented:
...Most of the spec's are guesswork themselves as well... it's still hit and miss :-)
0
 
higgsyAuthor Commented:
This doesnt seem to run true actually

ive noticed that margin-left is ignored by netscape, and padding-left is ignored by IE....

so what ive done is the following :

<ul style="padding-left: 10px; margin-left: 10px;">

it seems to work fine then in both browsers.......can anyone see any problem with this code???

Thanks

Al
0
 
seanpowellCommented:
Sorry, I missed your netscape comment... if you're targetting both browsers, than you need both attributes. (There's a lot of discussion pertaining to whether Netscape is confused on this - but that's the only solution at this point...)
0
 
apprentiCommented:
Here's an article you might find useful:

http://www.alistapart.com/articles/taminglists/
0
 
COBOLdinosaurCommented:
You don't need the <li>

Use:

<span>&bull; item one</span><br />
<span>&bull; item two</span><br />

Displays the way you want in both browsers and it is valid HTML.  If you are going to try to solve a problem by hacking non-standard code; you cannot expect anything but IE to support the hack.

Cd&
0
 
ZontarCommented:
> <span>&bull; item one</span><br />
> <span>&bull; item two</span><br />

> Displays the way you want in both browsers and it is valid HTML.

And it is also absolutely meaningless. HTML is a *structural* language. If your intent is for a set of items to be a list, use the proper HTML for a list structure, then style its appearance afterwards.
0
 
COBOLdinosaurCommented:
Zontar,

Too begin with HTML is neither structural nor a language.  It is simple markup.  Any structure is at a document level and is dependent on interpretations of the DTD (specified of defaulted).

Based on the question higgsy is interested in the rendered presentation, not requirements of a list or the properties of a list.  Thus the application of a non-standard approach the is not cross-broswer compatible.  The solution of creating a correct structure with the UL is tecnically correct, but requires addition code.

Using spans satifies the rendering requirement, resolves cross-browser issues and is standards compliant.  So are you saying that this is not a solution because it must be solved with a valid list structure; or are you saying that you don't like span used in such circumstances?

If the objective is academic purity, then there are very few solutions available for the common probelms of web development.

higgsy,

The magin and padding attributes should render the same in current browser with a valid DOCTYPE, but you may find differences in rendering  between IE5, IE5.5, IE 6 (quircky mode) and IE 6(compliant mode).

Early builds of Netscrap 6, and Mozilla prior to version 1.3, may not render the tpadding correctly.  However, the differences for these earlier browsers is not worth any extra effort, and you should use what ever meets your needs for the browsers and browser versions you have to support.

Cd&
0
 
ZontarCommented:
> HTML is neither structural nor a language.

You're wrong on the first count, and splitting hairs on the other. HTML is structural markup. It is not and was never intended to be used as a presentation language. And no, it's not a programming language, but it is a language. And if it is so simple, why do so many people appear not to be able to use it correctly?

> Any structure is at a document level and is dependent on interpretations of the DTD (specified of defaulted).

That's a ridiculous thing to say. It is not untrue, but it's misleading as hell -- you're attempting to provide an excuse to perpetuate the authoring of tag soup, rather than meaningful documents. Data has no meaning outside of its structure, so to speak of markup divorced from a DTD (even if it's only implied) or schema is a waste of time.

The importance of authoring well-structured documents becomes apparent when we consider non-PC devices and trying to extract semantically useful information from tag soup.

<span> has no use other than for applying presentation via CSS, it is semantically null, and this task can almost always be dome better by using meaningful inline elements (<strong>, <em>, etc).

<ul>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ul>

is a list.

<span>item</span><br>
<span>item</span><br>
<span>item</span><br>

is NOT a list. It's crap. It's static.

> If the objective is academic purity, then there are very few solutions available for the common probelms of web
> development.

Dismissing me as though I'm some sort of mindless zealot does nothing towards devising such solutions. Yes, we must sometimes compromise with what's actually supported in browsers. This does not mean that we have to contribute to the death-by-white-noise of the World Wide Web while doing so.

> when validating forms we display all the errors to the user one after the other

higgsgy's stated objective here is indeed to display a *list of errors*. Therefore the optimal solution is to use an unordered list with appropriate margin/padding styles:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>F00B4R!</title>

<style type="text/css">
  ul.errors  {margin-left:10px; padding-left:10px;}
</style>
</head>
<body>
<ul class="errors">
  <li>You screwed up this...</li>
  <li>And this...</li>
  <li>And this...</li>
  <li>And this...</li>
  <li>And this...</li>
  <li>And this...</li>
</ul>
</body>
</html>

Calling a tail a leg does not make it one.
0
 
COBOLdinosaurCommented:
>>>Dismissing me as though I'm some sort of mindless zealot does nothing towards devising such solutions.

I'm not dismissing you as anything.  I don't see that you have sufficient standing for me to consider a debate with you.  I no longer spend much time on this site, because of this kind nonsense from "experts" who d not have a clue how the real world works on planet Earth.

Cd&
0
 
seanpowellCommented:
Cd&, that last statement is extremely pompous, arrogant and excessively intolerant. If that's what we can expect from your remarks here in the future, perhaps you should spend even less time on the site than you currently do.
0
 
COBOLdinosaurCommented:
I have always posted pompous, arrogant, and intolerant comments in response to wannabes who chose to pick a fight instead of just proposing alternatives to what has already been posted.  At least I have the credentials on this site and in this TA to be arrogant about, unlike those who had to wait for the site to be dumbed down before they could compete.

Cd&

0
 
seanpowellCommented:
Credentials mean little to me, and they certainly don't give anyone the right to be arrogant - which in my book, gives those credentials even less meaning. You seem overly pre-occupied with your standing - perhaps that's part of the problem :-)
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

  • 5
  • 4
  • 2
  • +4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now