Click here to Skip to main content
15,035,600 members
Articles / Web Development / HTML
Posted 20 Sep 2010

Tagged as


4 bookmarked

Use sidebars to improve article readability

Rate me:
Please Sign up or sign in to vote.
4.75/5 (3 votes)
20 Sep 2010CPOL
This tip shows how to use the new sidebar css classes to improve readability and add depth to an article.

Having trouble writing or posting articles? These articles aim to gather together tips and tricks from authors and mentors to help you write great articles.

Writing an article is often a balancing act between presenting the information you need to convey, and describing other interesting, but non-essential aspects of the topic. In the past when I have found myself in this situation, I have resorted to using html tables to achieve a sidebar. While this works, it is kludgy to set up.

Recently member knockNrod submitted a suggestion for a new CodeProject sidebar css class. This now has been incorporated into the official CodeProject css stylesheet and is available using <div class="sidebar-right"> and <div class="sidebar-left">. I want to thank knockNrod for sharing this great idea.

Have a favorite tip for writing CodeProject articles? Write a tip and share with everyone!


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Hans Dietrich
Software Developer (Senior) Hans Dietrich Software
United States United States
I attended St. Michael's College of the University of Toronto, with the intention of becoming a priest. A friend in the University's Computer Science Department got me interested in programming, and I have been hooked ever since.

Recently, I have moved to Los Angeles where I am doing consulting and development work.

For consulting and custom software development, please see

Comments and Discussions

GeneralHans, I put this in my Tip/Trick &amp; it looks very nice. T... Pin
thatraja7-Mar-11 13:35
professionalthatraja7-Mar-11 13:35 
GeneralRe: Wow. That really stands out, doesn't it? Pin
Hans Dietrich7-Mar-11 16:22
mentorHans Dietrich7-Mar-11 16:22 
GeneralReason for my vote of 5 Thanks for the tip. Pin
Ashley Davis26-Jan-11 23:12
MemberAshley Davis26-Jan-11 23:12 
GeneralReason for my vote of 5 Cute one dude, thanks Pin
thatraja16-Jan-11 6:44
professionalthatraja16-Jan-11 6:44 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.