what is this bullet point <li> not showing up with circles?

Question

I'm trying to show some bullet point list circles on my webpage, but it doesn't seem to show, and I tried using firebug but I can't find what's wrong, I went through my whole css file, and I don't see where the problem is, i want the list to be vertical with circles!

Please can you help me, here is the code :

/* Browser resets. */  html, body, div, span, object, iframe,  h1, h2, h3, h4, h5, h6, p, blockquote, pre,  a, abbr, acronym, address, code,  del, dfn, em, img, q, dl, dt, dd, ol, ul, li,  fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,  article, aside, dialog, figure, footer, header,  hgroup, nav, section {    margin: 0;    padding: 0;    border: 0;    font-weight: inherit;    font-style: inherit;    font-size: 1em;    font-family: inherit;      vertical-align: baseline;      line-height: 1.5em;  }        #fancy_ajax .note{    cursor:default; }    /* Three styles for the notes: */    .yellow{      background-color:#FDFB8C;      border:1px solid #DEDC65;  }    .blue{      background-color:#A6E3FC;      border:1px solid #75C5E7;  }    .green{      background-color:#A5F88B;      border:1px solid #98E775;  }    /* Each note has a data span, which holds its ID */  span.data{    display:none; }        /* Green button class: */  a.green-button,a.green-button:visited{      color:black;      display:block;      font-size:10px;      font-weight:bold;      height:15px;      padding:6px 5px 4px;      text-align:center;      width:60px;        text-shadow:1px 1px 1px #DDDDDD;      background:url(../img/button_green.png) no-repeat left top;  }    a.green-button:hover{      text-decoration:none;      background-position:left bottom;  }    .author{      /* The author name on the note: */      bottom:10px;      color:#666666;      font-family:Arial,Verdana,sans-serif;      font-size:12px;      position:absolute;      right:10px;  }    #main{      /* Contains all the notes and limits their movement: */      margin:0 auto;      position:relative;      width:980px;      height:500px;      z-index:10;      background:url(img/add_a_note_help.gif) no-repeat left top;  }    h3.popupTitle{      border-bottom:1px solid #DDDDDD;      color:#666666;      font-size:24px;      font-weight:normal;      padding:0 0 5px;  }    #noteData{      /* The input form in the pop-up: */      height:200px;      margin:0px 0 0 0px;      width:350px;  }    .note-form label{      display:block;      font-size:10px;      font-weight:bold;      letter-spacing:1px;      text-transform:uppercase;      padding-bottom:3px;  }    .note-form textarea, .note-form input[type=text]{      background-color:#FCFCFC;      border:1px solid #AAAAAA;      font-family:Arial,Verdana,sans-serif;      font-size:19px;          font-weight: bold;      height:60px;      padding:5px;      width:300px;      margin-bottom:0px;  }    .note-form input[type=text]{    height:auto; }    .color{      /* The color swatches in the form: */      cursor:pointer;      float:left;      height:10px;      margin:0 5px 0 0;      width:10px;  }    #note-submit{    margin:20px auto; }      body {      height:100%;      background-color: white;      font-size: 14px;      color: #333333;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;  }    /* custom selection colors */  ::-moz-selection {      color: #fff;      color: rgba(255,255,255,.85);      background: #ea4c88;  }    ::selection {      color: #fff;      color: rgba(255,255,255,.85);      background: #ea4c88;  }    /* Links */  a {      text-decoration: none;      color:  #19558D;      font-size: inherit;  }    a:hover {      text-decoration: underline;  }    a:visited {      text-decoration: none;      background-color: inherit;      color: #336699;  }    a img {      border: none;  }    /* Input fields + label */  input, textarea {      border: 1px solid #999999;      padding: 5px;  }    label {      float: left;      margin-right: 10px;      margin-top: 10px;      margin-bottom: 0pxpx;      width: 120px;      font-size: 22px;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;  }    #error {      font-size: 14px;  }    /* Lists */  li {      font-size: 14px;      margin-left: 10px;      list-style-type: circle;      display:inline;  }    li a {      margin-left: inherit;  }    #like_text {      float: left;      color: #0099CC;      cursor: pointer;      font-size: inherit;  }    .like_list_element {      width: 681px;      float: left;      padding-top: 15px;      margin-left: 0px;      height: 35px;      border-bottom: 1px solid #999999;  }    .like_list_element:hover {      width: 681px;      float: left;      padding-top: 15px;      margin-left: 0px;      height: 35px;      border-bottom: 1px solid #999999;      background-color: #EDEDED;  }      .micro_avatar {      float: left;      width: 30px;      height: 30px;      margin-right: 15px;      margin-top: -7px;      padding: 2px;      background-color: #ffffff;      -moz-box-shadow: 2px 2px 4px #D1D1D1;      -webkit-box-shadow: 2px 2px 4px #D1D1D1;      box-shadow: 2px 2px 4px #D1D1D1;      -moz-border-radius: 2px;      border-radius: 2px;  }    /* "Super" headline */  h1 {      font-weight: bold;      font-style: italic;      font-size: 38px;      color: #666666;      font-family: Georgia, "Times new roman", serif;  }    /* "Medium (bold)" headline */  h2 {      font-size: 20px;      font-weight: bolder;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;  }    /* Normal headline (used on profile page) */  .normal_headline {      font-size: 22px;      float: left;      font-weight: bold;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;  }    /* "Standard" headline */  h3 {      font-size: 15px;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;  }    /* page structure */    /* Container - main content goes here */  #container {      min-height: 100%;      height:100%;      width: 897px;      margin-bottom: 30px;      margin: 0 auto;  }    /* Left (main) content */  #left_content {      float: left;      width: 485px;      font-size: 1em;      padding-left: -15px;  }    ul.statuses{      margin:10px 0;  }    ul.statuses li {      position:relative;      padding:15px 15px 15px 10px;      list-style:none;      font-size:12px;  }            div.tweetTxt{        float:left;      width:400px;      overflow:hidden;  }    ul.statuses a img.avatar{      float:left;      margin-right:10px;      border:1px solid #446600;  }  div.date{      line-height:18px;      font-size:10px;      color:#999999;    }        .question_link{     float:left;  font-weight: bold;  margin-left:40px;     color:blue;          }    #answerText {        float:left;  width:480px;  margin-left:40px;  margin-bottom: 5px;    }  #answerText ul{        margin-left:40px;  }  #answerText li {        list-style-type: circle;      font-size:30px;      }  .answerActions {        float:left;      margin-left:40px;      font-size:9px;      }  .thanks{      font-weight:bold;  }  .content{      float:left;      }  /* Used for seperating content eg. Timeline && photos */  .left_content_seperator {      width: 485px;      float: left;      border-bottom: 1px solid #999999;      margin-top: 15px;      margin-bottom: 30px;      height: auto;  }    /* Used in eg. postphoto.php */  .big_content_seperator {      width: 897px;      float: left;      border-bottom: 1px solid #999999;      margin-bottom: 30px;  }    /* Right side content */  .right_content {      float: right;      width: 200px;      font-size: 14px;          margin-right:80px;  }    /* Used for seperating content eg. Timeline && photos */  .right_content_seperator {      width: 200px;      float: right;      margin-top: 33px;      margin-bottom: 15px;  }    .right_content_seperator_home {      width: 200px;      float: right;      margin-top: 25px;      margin-bottom: 15px;  }    /* For footer + header (outside the main container) */  .small_container {      margin: 0 auto;      width: 900px;    }    /* The bar on the top of the page */  .top_bar {      width: 100%;      height: 50px;      margin-bottom: 30px;      background:none repeat scroll 0 0 black;  }  #search {     width: 502px;   padding: 10px;   height:20px;   margin: 10px 0px 0px -30px;   background-color:#505759;   float:left  }    .question_box{    background: none repeat scroll 0 0 #FFFFFF;      border-color: #CCCCCC #999999 #999999 #CCCCCC;      border-style: solid;      border-width: 1px;      color: #000000;      font: 16px arial,sans-serif;      margin: -5px 0px 0px -5px;      padding: 5px 8px 0px 6px;      width:380px;      height:25px    }  input.blur {                  color: #999;              }  #search a {      color: #E5E5E5;      text-decoration: none;          font-weight: bold;  }    #search a:hover {      text-decoration: underline;    }  /* Logotype container */  .logotype {      background-color:#671E1E;      font-size: 20px;      float: left;          color:white;          padding:10px;            margin: 10px 30px 0px 0px;  }    /* The menu on the top of the page */  .top_menu {      float: right;      text-align: right;      background-color: inherit;      color: #ffffff;      margin: 15px 0px 0px 0px;      }    .top_menu a {      color: #E5E5E5;      text-decoration: none;  }    .top_menu a:hover {      text-decoration: underline;      color: inherit;  }    /* Main content + form container on the front page */  .text_box {      margin: 0 auto;      margin-top: 70px;      text-align: center;      width: 590px;  }    /* Box for the iPhone image on the front page */  .iphone_promo {      margin: 0 auto;      margin-top: 70px;      margin-bottom: 30px;      text-align: center;      width: 590px;  }    /* Red arrow next to the iPhone picture */  .arrow {      margin: 0 auto;      margin-left: 210px;      margin-bottom: -145px;  }    /* Typography */  .small_copy {      font-size: 12px;  }    #menu_list ul{          }  #menu_list li{      }        .not_selected {             -moz-border-radius: 5px 5px 5px 5px;      background-image: url("http://d1vgw4v7ja2ido.cloudfront.net/-9dfe92083011731d.gif");      background-position: left center;      background-repeat: no-repeat;      clear: both;      display: block;      font-weight: bold;      padding: 3px 5px 3px 10px;          color: #444444;      cursor: default;        }  .not_selected:hover{        background-color:lightblue;  }          .selected{            -moz-border-radius: 5px 5px 5px 5px;      background-image: url("http://d1vgw4v7ja2ido.cloudfront.net/-9dfe92083011731d.gif");      background-position: left center;      background-repeat: no-repeat;      clear: both;      display: block;      font-weight: bold;      padding: 3px 5px 3px 10px;        background-color: #E0E0E0;      color: #444444;      cursor: default;    }    #menu_list li{      margin-left: inherit;  }    .right_seperator {      width: 200px;      float: left;      border-bottom: 1px dotted #999999;      margin-top: 15px;      margin-bottom: 10px;      height: auto;  }    .light_gray_serif {      font-family: Georgia, "Times new roman", serif;      font-size: inherit;      color: #999999;      font-size: 14px;  }    /* Forms */  #email_form {      width: 285px;      height: 40px;      font-size: 22px;      margin-right: -1px;      outline: none;      font-weight: bold;      color: #999999;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      float: left;  }    #submit_button {      width: 295px;      height: 52px;      font-size: 22px;      font-weight: bold;      margin-left: -1px;      cursor: pointer;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      border: 1px solid #F9AA33;      float: right;  }    #username_form {      width: 448px;      height: 40px;      font-size: 22px;      margin-bottom: 15px;      outline: none;      font-weight: bold;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      float: right;  }    #password_form {      width: 448px;      height: 40px;      font-size: 22px;      margin-bottom: 15px;      outline: none;      font-weight: bold;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      float: right;  }    .standard_big_form {      width: 448px;      height: 40px;      font-size: 22px;      margin-bottom: 15px;      outline: none;      font-weight: bold;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      float: right;  }    /* Big login button */  #login_button {      width: auto;      padding-left: 20px;      padding-right: 20px;      height: 52px;      font-size: 22px;      font-weight: bold;      margin-left: -1px;      cursor: pointer;      color: inherit;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      border: 1px solid #F9AA33;      float: right;  }    #login_button:active {    position: relative;    top: 1px;  }    /* Standard buttons */  .big_button {      width: auto;      padding-left: 20px;      padding-right: 20px;      height: 52px;      font-size: 22px;      font-weight: bold;      cursor: pointer;      color: #333333;      font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;      border: 1px solid #F9AA33;      float: right;  }    .big_button:active {    position: relative;    top: 1px;  }    .profile_name_container {      width: auto;  }    .follow_container {      float: left;      width: auto;      margin-top: 7px;      margin-left: 15px;  }    .follow_button {      margin-left: 0px;      text-align: justify;      color: #0099CC;      padding-left: 20px;      padding-right: 4px;      padding-top: 4px;      padding-bottom: 4px;      -moz-border-radius: 5px;      border-radius: 5px;      font-size: 14px;      background: url(../images/follow-icon.png) no-repeat 4px 6px;  }    .follow_button:hover {      cursor: pointer;      margin-left: -1px;      margin-right: -1px;      background-color: #EDEDED;      border: 1px solid #999999;      background-image: url(../images/follow-icon.png) no-repeat 4px 6px;  }    .unfollow_button {      margin-left: 0px;      text-align: justify;      color: #0099CC;      padding-left: 20px;      padding-right: 4px;      padding-top: 4px;      padding-bottom: 4px;      -moz-border-radius: 5px;      border-radius: 5px;      font-size: 14px;      background: url(../images/unfollow-icon.png) no-repeat 4px 6px;  }    .unfollow_button:hover {      cursor: pointer;      margin-left: -1px;      margin-right: -1px;      background-color: #EDEDED;      border: 1px solid #999999;      background-image: url(../images/unfollow-icon.png) no-repeat 4px 6px;  }    .push_footer {      margin-bottom: 200px;  }    /* Footer (container) of the page */  .footer {    float: left;    margin-top: 30px;    padding-bottom: 15px;    width: 897px;      height: 49px;      border-top: 1px solid #999999;  }    /* "Photoblogging through events." text. */  .footer_info {      font-size: 14px;      float: left;      margin-top: 15px;  }    /* The link to 'Support & Feature requests' */  .footer_link {      font-size: 14px;      float: right;      margin-top: 15px;  }    /*** Colors ***/    /* Blue gradient (css gradients, #336699 is used for IE and older browsers) */  .blue_gradient {      background: #336699;      background: -webkit-gradient(linear, left top, left bottom, from(#0099CC), to(#336699));      background: -moz-linear-gradient(top,  #0099CC,  #336699);  }    /* Yellow gradient (for button) #FBAA33 = orange */  .yellow_gradient {      background: #FBAA33;      background: -webkit-gradient(linear, left top, left bottom, from(#FBF16E), to(#FBAA33));      background: -moz-linear-gradient(top,  #FBF16E,  #FBAA33);    }    .yellow_gradient:hover {      background: #F6D05A;  }      /* Image design */  .photo {      float: left;      min-width: 200px;      min-height: 200px;      padding: 5px;      margin-right: 15px;      margin-bottom: 15px;      background-color: #ffffff;      border: 1px solid #EAEAEA;      -moz-box-shadow: 4px 4px 10px #D1D1D1;      -webkit-box-shadow: 4px 4px 10px #D1D1D1;      box-shadow: 4px 4px 10px #D1D1D1;  }    .photo_thumbnail:hover {      filter:alpha(opacity=60);      -moz-opacity:0.6;      -khtml-opacity: 0.6;      opacity: 0.6;  }    .big_photo_container {      text-align: center;      width: 666px;      margin-bottom: 15px;  }    .event_name {      height: 20px;      margin-right: 5px;      width: 169px;      float: left;  }    .trash_can {      height: 17px;      width: 14px;      -moz-border-radius: 5px;      border-radius: 5px;      padding-top: 3px;      padding-left: 2px;      float: right;  }    .trash_can:hover {      cursor: pointer;      margin: -1px;      background-color: #EDEDED;      border: 1px solid #999999;  }    /* Image design */  .big_photo {      margin-top: 15px;      max-width: 656px;      padding: 5px;      background-color: #ffffff;      border: 1px solid #EAEAEA;      -moz-box-shadow: 4px 4px 10px #D1D1D1;      -webkit-box-shadow: 4px 4px 10px #D1D1D1;      box-shadow: 4px 4px 10px #D1D1D1;  }    .profile_photo {      float: left;      width: 50px;      height: 50px;      margin-right: 15px;      margin-bottom: 15px;      padding: 5px;      background-color: #ffffff;      -moz-box-shadow: 4px 4px 10px #D1D1D1;      -webkit-box-shadow: 4px 4px 10px #D1D1D1;      box-shadow: 4px 4px 10px #D1D1D1;      -moz-border-radius: 5px;      border-radius: 5px;  }    .profile {      padding-top: 15px;  }    /* Heart sign */  .fav {      margin-left: 0px;      color: #0099CC;      padding-left: 20px;      padding-right: 4px;      padding-bottom: 4px;      -moz-border-radius: 5px;      border-radius: 5px;      background: url(../images/heart-icons.png) no-repeat 4px 4px;  }    .fav:hover {      cursor: pointer;      margin-left: -1px;      margin-right: -1px;      background-color: #EDEDED;      border: 1px solid #999999;      background: url(../images/heart-icons.png) no-repeat 4px -13px #EDEDED;  }    .highlight {      margin-left: 0px;      color: #0099CC;      cursor: pointer;      padding-left: 20px;      padding-right: 4px;      padding-bottom: 4px;      -moz-border-radius: 5px;      border-radius: 5px;      background: url(../images/heart-icons.png) no-repeat 4px -13px;  }    .highlight:hover {      cursor: pointer;      margin-left: -1px;      margin-right: -1px;      background-color: #EDEDED;      border: 1px solid #999999;      background: url(../images/heart-icons.png) no-repeat 4px 4px #EDEDED;  }    /* Heart sign */  .likes {      font-size: inherit;  }    /* Views */  .views {      padding-left: 20px;      float: right;  }    /* Costum */    /* Removes underlines for eg. buttons */  .no_underline:hover {      text-decoration: none;  }    /* Margins */  .small_margin_top {      margin-top: 15px;  }    .negative_margin_top {      margin-top: -4px;  }    .custom_margin_top {      margin-top: 48px;  }    .no_margin_left {      margin-left: 0px;  }  .no_margin_top {      margin-top: 0px;  }    /* Paddings */  .no_padding_top {      padding-top: 0px;  }    .normal_font_weight {      font-weight: normal;  }    .photo_label {      margin-right: auto;      padding-left: 6px;      text-align: left;  }          /* button basics */    a.minibutton {      display:inline-block;      height:23px;      padding:0 0 0 3px;      font-size:11px;      font-weight:bold;      color:#333;      text-shadow:1px 1px 0 #fff;      background:url(http://github.com/images/modules/buttons/minibutton_matrix.png) 0 0 no-repeat;      white-space:nowrap;      margin-right:4px;      border:none;      overflow:visible;      cursor:pointer;      text-decoration:none;    }      a.minibutton>span {      display:block;      height:23px;      padding:0 10px 0 8px;      line-height:23px;      background:url(http://github.com/images/modules/buttons/minibutton_matrix.png) 100% 0 no-repeat;    }      a.minibutton:hover, a.minibutton:focus {      color:#fff;      text-decoration:none;      text-shadow:-1px -1px 0 rgba(0,0,0,0.3);      background-position:0 -30px;    }    a.minibutton:hover>span, a.minibutton:focus>span {background-position:100% -30px;}      a.minibutton.mousedown{background-position:0 -60px; }    a.minibutton.mousedown>span{background-position:100% -60px; }    /* answer button */    a.answer {      display:inline-block;      height:23px;      padding:0 0 0 3px;      font-size:18px;      font-weight:bold;      color:#333;      text-shadow:1px 1px 0 #fff;      background:url(http://github.com/images/modules/buttons/minibutton_matrix.png) 0 0 no-repeat;      white-space:nowrap;      margin-right:4px;      border:none;      overflow:visible;      cursor:pointer;      text-decoration:none;    }      a.answer>span {      display:block;      height:23px;      padding:0 10px 0 8px;      line-height:23px;      background:url(http://github.com/images/modules/buttons/minibutton_matrix.png) 100% 0 no-repeat;    }      a.answer:hover, a.answer:focus {      color:#fff;      text-decoration:none;      text-shadow:-1px -1px 0 rgba(0,0,0,0.3);      background-position:0 -30px;    }    a.answer:hover>span, a.answer:focus>span {background-position:100% -30px;}      a.answer.mousedown{background-position:0 -60px; }    a.answer.mousedown>span{background-position:100% -60px; }    /* with icon */    a.btn-download .icon {      float:left;      margin-left:-4px;      width:18px;      height:22px;      background:url(http://github.com/images/modules/buttons/minibutton_icons.png?v20100306) 0 0 no-repeat;    }    a.btn-download .icon {background-position:-20px 0;}    a.btn-download:hover .icon, a.btn-download:focus .icon {background-position:-20px -25px;}      #profile_pic{         padding:5px;      border:1px #AAAAAA solid;        float:left;  }    ul.stats{        width:auto;      float:left;      display:inline;      margin: 20px 0px 0px 0px;           }    ul.stats li{        display:inline-block;      text-align:left;    }  .stats_number{        font-weight:bold;       font-size:10px;  }   .stats_text{        font-size:9px;      color:#505759;  }    ul.followingBar{        width:auto;      float:left;        margin: 0px 0px 0px 0px;    }  .watchingTopics{        float:left  }    ul.followingBar li{        display:block;     margin: 10px 0 0 0 ;      border-bottom:1px #999999 solid;    }    .topicFollow{      padding-bottom:10px;      font-weight:bold;      float:left;  }  .related_questions{      padding-bottom:10px;      font-weight:bold;  }    .panel      {      margin-left:50px; margin-right:50px; margin-bottom:5px; background-color:#D3E7F5;  padding:6px; width:400px;      display:none; float:left;      }      .load_comment      {      margin-left:50px; margin-right:50px; margin-bottom:5px; background-color:#D3E7F5; height:auto; padding:6px; width:400px; font-size:12px;          float:left;      }      .flash_load      {      margin-left:50px; margin-right:50px; margin-bottom:5px;height:20px; padding:6px; width:400px;      display:none;    }          .loadplace{              margin-top:70px;  }

<ul class="statuses">    <li>  <div id="answerText">      <ul>          <li>google</li>          <li>yahoo</li>          <li>quora</li>                </ul>      </div>  </li>     </ul>

Answer 1

li only gets its list-style-related styles applied if it has display: list-item

Answer 2

Your style for <li> is wrong:

li {     font-size: 14px;     margin-left: 10px;     list-style-type: circle;     display: inline;  } 

should be

li {     font-size: 14px;     margin-left: 10px;     list-style-type: circle;  }