Bold Numbers on Ordered List

At the heart of the web apps I write, once you strip away all of the libraries, is just HTML and CSS. At times I forget that and tend to over-think problems. Recently I needed to make the numbers of an ordered list bold without making the content of the list items

  • bold. For a short time I was stumped. The number is considered by HTML to be part of
  • tag, but there is no way to address it individually.

  • On the web I ran across a lot of solutions to this issue, none of which felt right to me, they were all too complicated. The solution I chose was so simple, I don’t why I had to think about. 

    The contents of the

  • tags is completely under my control, so instead of trying to think of a way to address the numbers, I instead decided to address the
  • tags. All I needed to do was to put a tag inside of each
  • tag, I would then be able to address the
  • without affecting the number. So I made the
      tag have bold text and made the

    1. combination have normal text. Problem solved.
  • https://gist.github.com/Rockncoder/6406490.js

    Advertisements

    Leave a Reply

    Fill in your details below or click an icon to log in:

    WordPress.com Logo

    You are commenting using your WordPress.com account. Log Out / Change )

    Twitter picture

    You are commenting using your Twitter account. Log Out / Change )

    Facebook photo

    You are commenting using your Facebook account. Log Out / Change )

    Google+ photo

    You are commenting using your Google+ account. Log Out / Change )

    Connecting to %s