Question

Kindly see this page:
http://www.technodoze.com
See the Button in the Categories on the right side of the page.
See the word Tips and Tricks.
Problem 1:
It is expanded in whole the column .
The problem is: I want my cell to be expanded just according to the text string but it is looking awkward.
Problem 2:
See the link Web Designing half of which is lying on one line half on other, i want it to be on same line. (One <a> link, one line.)
My Code:

<style type="text/css">
  .cat_link a, .cat_link a:hover, .cat_link a:focus{
  padding: 0.25em;
  color:#3B5998;
  font-family: Verdana;
  text-decoration: none;
  border:1px solid #DADADA;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px;
  background: #EDEFF4;
  margin-left: 0;
  margin-right: 0;
  line-height:2;
  margin-top: 1em;
  margin-bottom: 1em;
}
  .cat_link {
  line-height:2;
}
</style>

HTML CODE:

<p class="cat_link">
  <a href="http://www.technodoze.com/search/label/Cell%20Phones">Cell Phones</a>
  <a href="http://www.technodoze.com/search/label/Android">Android</a>
  <a href="http://www.technodoze.com/search/label/Tips%20and%20Tricks">Tips and Tricks</a>
  <a href="http://www.technodoze.com/search/label/Amazing">Amazing</a>
  <a href="http://www.technodoze.com/search/label/Web%20Designing">Web Designing</a>
  <a href="http://www.technodoze.com/search/label/Windows%20Tips">Windows Tips</a>
  <a href="http://www.technodoze.com/search/label/Physics">Physics</a>
  <a href="http://www.technodoze.com/search/label/CSS">CSS</a>
  <a href="http://www.technodoze.com/search/label/CSS%203">CSS 3</a>
  <a href="http://www.technodoze.com/search/label/Communication">Communication</a>
  <a href="http://www.technodoze.com/search/label/Facebook%20tips">Facebook Tips</a>
  <a href="http://www.technodoze.com/search/label/Dajjal">Dajjal</a>
  <a href="http://www.technodoze.com/search/label/Bermuda%20Triangle">Bermuda Triangle</a>
</p>

Please give me solution if you can.

Answer 1

add this to css classes

.cat_link{
   text-align: left ;  /* gets rid of wierd white space */
}

.cat_link a{
    white-space: nowrap;   /*stops buttons from taking up two lines */
   }