Please Check my DIV tags

PearlDoves · 08-11-2006, 03:06 AM

I've been playing around with code enough now to be suspicious as to whether or not the two "</div>" tags near the end of this bit of script may not be in the right place. Please let me know if they are fine where they are, or if one or both should be moved and where it should be moved...

ALSO... if I don't have any text in my web page other than what is graphic based or what pops up because of java script.... Do I need to have all the jargin about text color, size, font family and so on... What can I delete from that if any?

Thanks in advance!

<table border="0" width="100%" cellspacing="0" cellpadding="0">

<tr><td width="33%"><div id="motioncontainer" style=" color: black; font-size: medium; font-family: serif; font-weight: bold; line-height: normal; text-align: left; visibility: visible; display: block; position: relative; left: 102px; width: 665px; height: 285px; overflow: hidden;"><div id="motiongallery" style="position:absolute;left:0;top:0;white-space: nowrap;"><nobr id="trueContainer">
<a href="javascript:enlargeimage('lanternpost492.jpg')"><img src="lanternpost285.jpg" border=1></a>
<a href="javascript:enlargeimage('frog442.jpg')"><img src="frog285.jpg" border=1></a>
<a href="javascript:enlargeimage('swcomb492.jpg')"><img src="swcomb285.jpg" border=1></a>
<a href="javascript:enlargeimage('NARP500.jpg')"><img src="NARP285.jpg" border=1></a>
<a href="javascript:enlargeimage('dolphin422.jpg')"><img src="dolphin285.jpg" border=1></a>
<a href="javascript:enlargeimage('NSAAballet442.jpg')"><img src="NSAAballet285.jpg" border=1></a>
<a href="javascript:enlargeimage('herrmann492.jpg')"><img src="herrmann285.jpg" border=1></a>
<a href="javascript:enlargeimage('brtn360.jpg')"><img src="burtonswan285.jpg" border=1></a>
<a href="javascript:enlargeimage('piranha442.jpg')"><img src="piranha285.jpg" border=1></a>
<a href="javascript:enlargeimage('swmom492.jpg')"><img src="swmom285.jpg" border=1></a>
<a href="javascript:enlargeimage('sweeteats500.jpg')"><img src="sweeteats285.jpg" border=1></a>
<a href="javascript:enlargeimage('SOCK335.jpg')"> <img src="SOCK285.jpg" border=1></a>
<a href="javascript:enlargeimage('wickedqueen492.jpg')"><img src="wickedqueen285.jpg" border=1></a>
<a href="javascript:enlargeimage('pillfish492.jpg')"><img src="pillfish285.jpg" border=1></a>
<a href="javascript:enlargeimage('stamp585.jpg')"><img src="stamp285.jpg" border=1></a>
<a href="javascript:enlargeimage('ribbons492.jpg')"><img src="ribbons285.jpg" border=1></a></nobr></div></div></td></tr>

</table>

RexxCrow · 08-11-2006, 03:43 AM

Code:

- CSS -
#motioncontainer{position:absolute;left:0;top:0;white-space:nowrap;visibility:visible;display:block;position:relative;left:102px;width:665px;height:285px;overflow:hidden;}

- BODY -
<table border="0" width="100%" cellspacing="0" cellpadding="0"><tr><td width="33%">
<div ID="motioncontainer"><nobr ID="trueContainer">
<a href="javascript:enlargeimage('lanternpost492.jpg')"><img src="lanternpost285.jpg" border="1"></a>
<a href="javascript:enlargeimage('frog442.jpg')"><img src="frog285.jpg" border="1"></a>
<a href="javascript:enlargeimage('swcomb492.jpg')"><img src="swcomb285.jpg" border="1"></a>
<a href="javascript:enlargeimage('NARP500.jpg')"><img src="NARP285.jpg" border="1"></a>
<a href="javascript:enlargeimage('dolphin422.jpg')"><img src="dolphin285.jpg" border="1"></a>
<a href="javascript:enlargeimage('NSAAballet442.jpg')"><img src="NSAAballet285.jpg" border="1"></a>
<a href="javascript:enlargeimage('herrmann492.jpg')"><img src="herrmann285.jpg" border="1"></a>
<a href="javascript:enlargeimage('brtn360.jpg')"><img src="burtonswan285.jpg" border="1"></a>
<a href="javascript:enlargeimage('piranha442.jpg')"><img src="piranha285.jpg" border="1"></a>
<a href="javascript:enlargeimage('swmom492.jpg')"><img src="swmom285.jpg" border="1"></a>
<a href="javascript:enlargeimage('sweeteats500.jpg')"><img src="sweeteats285.jpg" border="1"></a>
<a href="javascript:enlargeimage('SOCK335.jpg')"> <img src="SOCK285.jpg" border="1"></a>
<a href="javascript:enlargeimage('wickedqueen492.jpg')"><img src="wickedqueen285.jpg" border="1"></a>
<a href="javascript:enlargeimage('pillfish492.jpg')"><img src="pillfish285.jpg" border="1"></a>
<a href="javascript:enlargeimage('stamp585.jpg')"><img src="stamp285.jpg" border="1"></a>
<a href="javascript:enlargeimage('ribbons492.jpg')"><img src="ribbons285.jpg" border="1"></a>
</nobr></div></td></tr></table>

The items highlighted in red may or may not be needed, (off to the right side of the rules for the motioncontainer you will notice that you have position being set again after it was defined at the start of the rule set.) If you do not want the borders around the images, change the border="1" to border="0" in each of the A tags. You only need the DIV tags if you are needing to style this section of A tags/images. The nobr tag is used to make them all line up by stripping out the CR 's. (Carriage Returns).

PearlDoves · 08-11-2006, 05:49 AM

Thanks for your help!