Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Westi on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Validation question 1

Status
Not open for further replies.

Volk359

Technical User
Jun 30, 2004
395
US
Why would this validate:
Code:
<div class="curvy">
  <div id="ctl"><div id="quadtl">&bull;</div></div>
  <div id="cbl"><div id="quadbl">&bull;</div></div>
  <div id="ctr"><div id="quadtr">&bull;</div></div>
  <div id="cbr"><div id="quadbr">&bull;</div></div>
<div id="txt"><center>Lorem ipsum dolor sit amet.</center></div>
</div>

but this wont:

Code:
<div class="curvy">
  <div id="ctl"><div id="quadtl">&bull;</div></div>
  <div id="cbl"><div id="quadbl">&bull;</div></div>
  <div id="ctr"><div id="quadtr">&bull;</div></div>
  <div id="cbr"><div id="quadbr">&bull;</div></div>
<div id="txt"><center>Lorem ipsum dolor sit amet.</center></div>
</div>
<br>
<div class="curvy">
  <div id="ctl"><div id="quadtl">&bull;</div></div>
  <div id="cbl"><div id="quadbl">&bull;</div></div>
  <div id="ctr"><div id="quadtr">&bull;</div></div>
  <div id="cbr"><div id="quadbr">&bull;</div></div>
<div id="txt"><center>Lorem ipsum dolor sit amet.</center></div>
</div>
 
Without trying to untangle the nested <divs> (they look wrong, but could be right).

I'd say it's because you have used the same ID's on 2 different <divs>

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
Simpler:
Code:
<div id="txt">Lorem ipsum dolor sit amet.</div>
<div id="txt">Lorem ipsum dolor sit amet.</div>

Seems that would be the case but I thought you could do that if you closed the first <div>. Does that mean I have to create a different ID everytime I want to use it?

Could be tedious if I had a bunch of these in a page.
 
Volk359, Foamy is correct... it should be:
Code:
<div class="txt">Lorem ipsum dolor sit amet.</div>
<div class="txt">Lorem ipsum dolor sit amet.</div>

Take a look here:

Let us know your results!

X
 
Yes, ID's must be unique as they refer to a specific instance of an element within the DOM. IF you create more than one element with the same name then things get confusing!

Classes can be reused as they are simply like sets of CSS rules. Think of classes as shorthand.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
Dang, looks like I've got some recoding to do.

Thanks to both of you.
 
hey guys!

about foamcows comment: won't we get in trouble if we've got css-classes which are actually called that way ("txt" in the example)?
that would change the div's appearance, which is probably not what volk wants.
what if we wants the div formatted by a css, are multiple attributes called "class" ok in the same tag?

why do you want thoses taggegs named the same, volk?

__________________________________________
a programmer is a tool that converts coffee into code...
aschi666, sthcomputing.de
 
You can reuse classes with no problem.
Classes say "this element belongs to this style group" if you like.
Whereas id says, "this element IS this". It must be unique.

You can even apply multiple classes to the same element.

So you could set up styles like so:
Code:
.thumb { border:1px solid black; margin:2px; }
.right { float:right; margin-left:4px; }
.left {float:left; margin-right:4px; }

Then mix and match them like this:

Code:
<img src="myImage.jpg" alt="blah" class="thumb right" />
.....
<img src="myOtherImage.jpg" alt="blah blah" class="thumb left" />

Very useful.

I don't understand why you think "txt" would cause a problem as a class name? Or did I misunderstand?

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
aschi666, I wanted to use them for text in two different areas. It goes back a thread or two regarding rounded boxes using bullets. If I change the ID's to CLASS I loose the round corner effect.

I want to recode it anyway with images, gives me a little better control. Also, I found that if the text size is changed by the user you get a very unwelcome effect on the box, more like a Mickey Mouse box.
tongue.gif


Foamcow, good explaination of classes and ID's. [thumbsup]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top