Web Rookie new to all this - Help :)

[urlrookie]

Hi, okay total newbie at Uni learning HTML and CSS for starters...

trying to impliment rel element to a gallery - works fine for single images - but not for a gallery.

The sample code I found on the net is:

<a href="images/plant1.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant1_t.jpg" alt="Plant 1" /></a> 
<a href="images/plant2.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant2_t.jpg" alt="Plant 2" /></a> 
<a href="images/plant3.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant3_t.jpg" alt="Plant 3" /></a> 
<a href="images/plant4.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant4_t.jpg" alt="Plant 4" /></a>

So Ive put all the Java and CSS in fine - but the 'rel' section - trying to workout where to put it in these lines of code for my own gallery....

<div class="g-main"><a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox"><img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" /></a></div>
    <div class="g-main"><a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox"><img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" /></a></div>
    <div class="g-main"><a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox"><img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" /></a></div>
    <div class="g-four"><a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox"><img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" /></a></div>

Im scratching my head here... so any help for a rookie would be very grateful....

Thanks

[Matthew N.]

Wouldn't you put the rel attribute on the a tag to open the image? (well, that's how it works with Lightbox anyway)

[Biiim]

I've only ever seen the rel attribute used on a, link & style tags, never come across it being used in a gallery before. An attribute is just a variable passed along in some code so it won't matter what you attach it to, it just may do nothing cause the browser hasn't been told to do anything with it or even do something you might not of intended to happen.

eg. the title attribute tells the browser to put its contents into a floating caption box

<div class="g-main">
	<a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox" rel='gallery-plants'>
		<img src="../images/gallery/placer/gallery_placer-t.jpg" border="0"/>
	</a>
</div>
<div class="g-main">
	<a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox" rel='gallery-plants'>
		<img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" />
	</a>
</div>
<div class="g-main">
	<a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox" rel='gallery-plants'>
		<img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" />
	</a>
</div>
<div class="g-four">
	<a href="../images/gallery/placer/gallery_placer-L.jpg" title="Caption Copy Here" class="thickbox" rel='gallery-plants'>
		<img src="../images/gallery/placer/gallery_placer-t.jpg" border="0" />
	</a>
</div>

It's also nice to make your code read friendly for yourself to be able to pick up what's happening and for others to carry on where you left off!