close

Subscriptions

  • None
mr-helpful

Last seen: 2 weeks ago

helpful is a 99 year old person from England, UK

Is there something about Stumble blogs you'd like help with - or think others would like to know? I can't fix bugs, broken toolbars, marriage problems - those you need to take to the Help & Bugs forums!
More superb help facilities here, and here *** Please note that I am not here very often and probably can't answer individual questions, but if I see the same question being asked a lot, I may create a new entry to cover it. ***

  • Created Aug 10 2008 •

    How can I box my text?

    This tip describes a method of "boxing" text, so that it looks like this:


      Rough winds do shake the darling buds of May,

      And summer's lease hath all too short a date:


    The code for the above example looks like this:

      <ul style="border: 1px solid #ff0000; margin-left: 125px; padding: 10px; text-align: left; width: 325px;">Rough winds do shake the darling buds of May,<br>
      And summer's lease hath all too short a date: <br>      </ul>


    By adjusting the various values in this code you can:
    • add a border to create a "box" around your text
    • control the size, color and appearance of the border
    • control the width of the "box"
    • control the location of the "box" (relative to the side of the blog)
    • align the text within the "box"

    Here are some examples with the code for each below (changes from the first example shown in red):
      Rough winds do shake the darling buds of May,

      And summer's lease hath all too short a date:
      <ul style="border: 1px solid #ffff00; margin: 25px; padding: 50px; text-align: left; width: 325px;">Rough winds do shake the darling buds of May,
      <br>And summer's lease hath all too short a date: <br></ul>



      And summer's lease hath all too short a date.
      Sometime too hot the eye of heaven shines,

      <ul style="border: 4px dotted #0000ff; margin-left: 125px; padding: 5px; text-align: right; width: 225px;">And summer's lease hath all too short a date.<br>Sometime too hot the eye of heaven shines,<br></ul>



      And often is his gold complexion dimm'd;

      And every fair from fair some time declines,

      <ul style="border: 1px solid #00ff00; margin-left: 55px; padding: 15px; text-align: left; width: 525px;"><center>And often is his gold complexion dimm'd;
      <br>And every fair from fair some time declines,<br></center></ul>


    Tips:
    • choose border colors that are complimentary to your blog theme
    • it is best to define your border color as a hex code (e.g. #ff0000 rather than red) because not all of the color "words" are honored by all browsers.
    • you can do more with this code than shown in the few examples above - experiment a little, and remember that you can always delete the entry if you don't like the results!
    • once you have the code just the way you like it, keep a copy in a text file so that you can quickly re-use it.