Sidebar Fix #2: the < break > tag

This post is the third in a series called, “Save the Sidebar!”  Click on the button below to start at the beginning!

save-the-sidebars

A lot of you use <br> tags to accomplish a space between sidebar items.  Although this will work, it will interfere with validating your site, it will probably be deprecated pretty soon, AND it doesn’t make very good use of your time.

Did you know that if you add the proper HTML tags, you can style everything with ONE line in the stylesheet?  <– if that sounds like complete geekeze to you – do not fear!  This is only my way of convincing you to do it properly. If the reasons why don’t make sense to you, then just do it my way ’cause I said somovingrightalong.

So, if you happen to want a line break in between your images, you can REMOVE the <br> tags, and add the proper tags depending on what you are trying to accomplish.  Do you want a new paragraph?  Then use a <p> tag.  Do you want a list of items with each item on its own line?  Then use <li> tags.  M’kay?

If, in the rare case, you actually do want a ‘soft return’ or line break, as opposed to a ‘hard return’ or new line, then this is the occasion for a <br> tag.  Here’s how to use it:

As with all other HTML tags, it requires a beginning and an END.  So please, for the love of all your techy friends, use this tag: <br />.    The line breaking tag doesn’t surround anything.  Rather it defines an action.  So you can use this, and include the ending slash right in the tag.  This is very similar to the <img> tag.

For some reason I can NEVER remember where to put that end slash.  I have to look it up every time!  Anybody have an easy-to-remember trick for me?

Next time – we discuss what on earth I mean by <li> tags…

Happy Blogging,

Cathy

Similar Posts

One Comment

  1. To be precise: lt;br> is HTML, lt;br /> is XHTML. We’ll be back to HTML (the new version 5 – XHTML is the past) within a decade or so, so lt;br> will be back without the trailing slash, I believe.

    Your own sidebar appears to be broken. Never seen something like that before. I won’t screenshot because I’m lazy and unhelpful like that. Firefox 3.5.2, Windows.

Leave a Reply

Your email address will not be published.