Question

I am having trouble with aligning jQuery tags, I’ve used a bit of a code and changed it and styled it myself, however the align seems to be leaving a space on the left, which I don’t want, and I’m not sure how to get rid of it. Here’s what I mean…

http://postimage.org/image/8k5rcz941/

This is the CSS code:

.usual {
  color:#111;
  padding:15px 20px;
  margin:8px auto;
}
.usual li { list-style:none; float:left; }
.usual ul a {
  display:block;
  padding:6px 10px;
  text-decoration:none!important;
  margin:1px;
  margin-left:0;
  font:10pt Verdana;
  color:#FFF;
  background:#444;
}
.usual ul a:hover {
  color:#FFF;
  background:#111;
  }
.usual ul a.selected {
  margin-bottom:0;
  color:#fff;
  background:#003663;
  border-bottom:1px solid snow;
  cursor:default;
  }
.usual div {
  padding:10px 10px 8px 10px;
  *padding-top:3px;
  *margin-top:-15px;
  clear:left;
  background:snow;
  font:8pt Verdana;
  border: 1px solid #d0d0d0;
}
.usual div a { color:#000; font-weight:bold; }

Hope you can help me shift this to the left, I’ve been trying to figure out what it is, and just can’t 🙁

Thanks and regards.

Answer 1

I’m guessing that the ul has a margin or padding applied. Remove it:

.usual > ul {
    margin: 0;
    padding: 0;
}