.comment-link {margin-left:.6em;}

Fat Steve's Archives

| Wednesday, June 01, 2005

Indentations and Thumbnails

Start, no indentation.
  • This
  • That
  • The other

After list, no indentation in this sentence.

The HTML code for the above list is this:
<ul> <li>This</li> <li>That</li> <li>The other</li></ul>

Note that before "This," "That," and "The other," a <li> tag appears, with a <li> tag after each item.

The list again, with no </li> after each item:
  • This
  • That
  • The other

After the list, still no indentation in this sentence.

The HTML code for the above list is this:
<ul> <li>This <li>That <li>The other</ul>

  • This
  • That
  • The other

    This time I left of the </ul> at the end of the unsorted list. No visible appearance difference in the list, but note that this text is still indentended. The code for the third list is:

    <ul> <li>This <li>That <li>The other

I've now inserted the </ul> onto this page, to get rid of the indentation.

        And now that the indentation experiment is done, I can go back to indenting with "&nbsp; &nbsp; &nbsp; &nbsp; ", and double spacing with ".&nbsp; ", as God intended.

        What follows is a thumbnail experiment, to make sure I can get use a thumbnail in the blog.

        The first thumbnail is the result of copying the code that was on the Flickr page, and adding a description:

NA/KabulSaltPit
Click here for larger size
(in a new window)

        The code from the Flickr page:
<a href="http://www.flickr.com/photos/28508779@N00/60800012/" title="Photo Sharing"><img src="http://static.flickr.com/28/60800012_68bcda4f7e_t.jpg" width="100" height="86" alt="NA/KabulSaltPit" /></a>

        The code after I added the description:
<a href="http://www.flickr.com/photos/28508779@N00/60800012/" title="Photo Sharing"><img src="http://static.flickr.com/28/60800012_68bcda4f7e_t.jpg" width="100" height="86" alt="NA/KabulSaltPit" /><br>Click here for larger size</a>

        Note well the <br> that I put in the description, it moves the link underneath the photo.

        The link under the above thumbnail takes you to a Flickr page where you can comment on the photo.

        And here it is again, but this time with the phrase:
title="Photo Sharing"
removed from the code Flickr provided, and an alternate link provided, to open the page in a new window:

NA/KabulSaltPit
Click here for larger size
(in a new window)

        Well, I can't see any difference in the results.

        The code for the second thumbnail:
<a href="http://www.flickr.com/photos/28508779@N00/60800012/" ><img src="http://static.flickr.com/28/60800012_68bcda4f7e_t.jpg" width="100" height="86" alt="NA/KabulSaltPit" /><br>Click here for larger size</a> <a href="http://www.flickr.com/photos/28508779@N00/60800012/" target="_blogView">(in a new window)</a>

        It's the phrase ' target="_blogView" ' that opens the new window.

       Finally, the following thumbnail takes you to a page on this blog where the photo is, with a link to Flickr.

NA/KabulSaltPit
Click Here for large size
  (in a new window)

        And here's the code for the third thumbnail:

<a href="http://stevesdummy.blogspot.com/2005/11/large-photo-of-salt-pit-prison-in.html"><img src="http://static.flickr.com/28/60800012_68bcda4f7e_t.jpg" width="100" height="86" alt="NA/KabulSaltPit"/><br>Click Here for large size</a>  <a href="http://stevesdummy.blogspot.com/2005/11/large-photo-of-salt-pit-prison-in.html" target="_blogView">(in a new window)</a>

        Too bloody much work, figuring this out, but it's done at last.

0 Comments:

Post a Comment

Links to this post:

Create a Link

<< Home