Page 1 of 1
help with image links
Posted: Fri Mar 28, 2008 10:35 pm
by jdrury
I am miserable at html, and the photos I have currently posted in an entry (thumbnails with links to larger images), instead of arranging in a straight row, are showing up diagonal to one another (see the
entry to see what I'm talking about).
Can anyone tell me how to fix this?
Thanks in advance,
J.P.
Posted: Sat Mar 29, 2008 6:01 pm
by jdrury
Here is the code I'm using. The break tag may be somewhere that I can't figure out.
<center><a class='serendipity_image_link' href='/ed/blogs/Drury_Jon/uploads/shells1.JPG'><!-- s9ymdb:6 --><img width="100" height="133" style="float: left; border: 0px; padding-left: 5px; padding-right: 5px;" src="/ed/blogs/Drury_Jon/uploads/shells1.JPG" alt="" /></a>
<a class='serendipity_image_link' href='/ed/blogs/Drury_Jon/uploads/shells2.JPG'><!-- s9ymdb:6 --><img width="100" height="133" style="float: left; border: 0px; padding-left: 5px; padding-right: 5px;" src="/ed/blogs/Drury_Jon/uploads/shells2.JPG" alt="" /></a>
<a class='serendipity_image_link' href='/ed/blogs/Drury_Jon/uploads/shells3.JPG'><!-- s9ymdb:6 --><img width="100" height="133" style="float: left; border: 0px; padding-left: 5px; padding-right: 5px;" src="/ed/blogs/Drury_Jon/uploads/shells3.JPG" alt="" /></a>
<a class='serendipity_image_link' href='/ed/blogs/Drury_Jon/uploads/shells8.JPG'><!-- s9ymdb:6 --><img width="100" height="133" style="float: left; border: 0px; padding-left: 5px; padding-right: 5px;" src="/ed/blogs/Drury_Jon/uploads/shells8.JPG" alt="" /></a>
<a class='serendipity_image_link' href='/ed/blogs/Drury_Jon/uploads/shells9.JPG'><!-- s9ymdb:6 --><img width="100" height="133" style="float: left; border: 0px; padding-left: 5px; padding-right: 5px;" src="/ed/blogs/Drury_Jon/uploads/shells9.JPG" alt="" /></a></center>
Posted: Sun Mar 30, 2008 12:32 am
by garvinhicking
Hi!
I suppose the issue is floating; the images are not cleared before they wrap.
I think you must insert <br style="clear: both" /> at some point, I don't know how else to properly wrap images.
Regards,
Garvin
Posted: Sun Mar 30, 2008 12:42 am
by jdrury
That arranges them vertically. Is there any way to have them in a horizontal row?
Posted: Sun Mar 30, 2008 12:55 am
by garvinhicking
Hi!
Ah, now I see. The nl2br plugin appllies the stacking br to your entries. You need to either:
1. Remove the nl2br event markup plugin (but you will loose automatic linebreaks everywhere
2. I don't know if this can be done, but: Configure the nl2br plugin to add a custom tag like "div class='images'" (note the missing <>) to the ignore list of when it should be applied. Then you can manually add a <div class="images"> befor your image listing, and </div> after it. This should prevent the nl2br markup plugin to convert linebreaks to <br> within your image list.
3. Maybe the easiest middle-way: Install the "Extended properties for entries" plugin, then you can conditionally exclude the nl2br markup plugin for individual entries inthe new "extended options" section of each entry. Then you can exclude your entry with the images to be applied.
HTH,
Garvin