Solved

trying to get rid of a bullet in css

Posted on 2012-03-29
2
506 Views
Last Modified: 2012-03-29
I am trying to get rid of a bullet next to the red underline text - see screen grab

the file is http://www.trevaskisconsulting.com/index2.html 

the html code it relates to is
<ul id="boxes">
      <li class="box01"><a href="building-surveying.html"><h2 class="style2">Building <span class="smaller">Surveying</span></h2></a>
      <ul class="boxy1">
      <li>text here</li>
      <li>text here</li>
      <li class="nobullets"><a href="building-surveying.html">more on Building Surveying</a></li>
      </ul></li>

css file is

@charset "utf-8";

* {
margin : 0;
padding : 0;
border : 0;
}

body  {

      margin: 0;
      padding: 0;
      text-align: center;
      color: #000000;
      background-image: url(images/background.jpg);
      background-repeat: repeat;
}
#container {
      width: 1000px;
      height:677px;
      margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
      text-align: left; /* this overrides the text-align: center on the body element. */
      background-image: url(images/bkg_white.png);
      background-repeat: no-repeat;
}
#header {
      height:124px;
      border-bottom: 1px solid #b3aa7e;
}

#sidebar1 {
      float: left;
      width: 285px;
      padding-left:33px;
      height:350px;
      padding-top:20px;

}
#sidebar1 ul {list-style-type : none; margin:0; padding:0; }
#sidebar1 li {
      list-style-type : none;
      padding-left:15px;
      background-image: url(images/arrow.gif);
      background-repeat: no-repeat;
      background-position: left top;
      padding-bottom:10px;
      position:relative;
}

#menu li ul li{      list-style-type : none; background-image: none; padding:0 0 5px 0; margin:0;}

#sidebar1 li a{text-decoration:none; color:#3a2719; font-size:13px; position:relative;}

#boxes ul {list-style-type : none; margin:0; padding:0; width:650px; height:376px; float:left;}
#boxes li a{
      list-style-type : none;
      width:207px;
      height:188px;
      float:left;
      display:inline-table;
      padding:0; margin:0;
}




li.box01{
      background-image: url(images/box01.gif);      background-repeat: no-repeat;      width:207px;
      height:188px; list-style-type : none; float:left; padding:0; margin:0; z-index:5;}
      
li.box02{
      background-image: url(images/box02.gif);      background-repeat: no-repeat;      width:207px;
      height:188px; list-style-type : none; float:left; z-index:5;}
      
li.box03{
      background-image: url(images/box03.gif);      background-repeat: no-repeat;      width:207px;
      height:188px; list-style-type : none; float:left; z-index:5;}
      
li.box04{
      background-image: url(images/box04.gif);      background-repeat: no-repeat;      width:207px;
      height:188px; list-style-type : none; float:left; z-index:5;}
      
li.box05{
      background-image: url(images/box05.gif);      background-repeat: no-repeat;      width:207px;
      height:188px; list-style-type : none; float:left; z-index:5;}
      
li.box06{
      background-image: url(images/box06.gif);      background-repeat: no-repeat;      width:207px;
      height:188px; list-style-type : none; float:left; z-index:5;}

#mainContent {
width: 677px;
height:440px;
float:left;
padding-top:20px;
z-index:1;
}
#footer {
      padding-left:33px;
      background-image: url(images/logo-rics.jpg);
      background-repeat: no-repeat;
      background-position: right top;
      padding-right:20px; margin-right:20px;
      height:54px;
}
#footer p {font: 12px 'ArvoRegular', Arial, sans-serif;
      margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
      padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
      float: right;
      margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
      float: left;
      margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
      clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}


@font-face {
    font-family: 'BevanRegular';
    src: url('fonts/Bevan-webfont.eot');
    src: url('fonts/Bevan-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Bevan-webfont.woff') format('woff'),
         url('fonts/Bevan-webfont.ttf') format('truetype'),
         url('fonts/Bevan-webfont.svg#BevanRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'AlfaSlabOneRegular';
    src: url('fonts/AlfaSlabOne-Regular-OTF-webfont.eot');
    src: url('fonts/AlfaSlabOne-Regular-OTF-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/AlfaSlabOne-Regular-OTF-webfont.woff') format('woff'),
         url('fonts/AlfaSlabOne-Regular-OTF-webfont.ttf') format('truetype'),
         url('fonts/AlfaSlabOne-Regular-OTF-webfont.svg#AlfaSlabOneRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ArvoRegular';
    src: url('fonts/Arvo-Regular-webfont.eot');
    src: url('fonts/Arvo-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Arvo-Regular-webfont.woff') format('woff'),
         url('fonts/Arvo-Regular-webfont.ttf') format('truetype'),
         url('fonts/Arvo-Regular-webfont.svg#ArvoRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ArvoBold';
    src: url('fonts/Arvo-Bold-webfont.eot');
    src: url('fonts/Arvo-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Arvo-Bold-webfont.woff') format('woff'),
         url('fonts/Arvo-Bold-webfont.ttf') format('truetype'),
         url('fonts/Arvo-Bold-webfont.svg#ArvoBold') format('svg');
    font-weight: normal;
    font-style: normal;

}



h1.fontface {font: 30px 'BevanRegular', Arial, sans-serif;letter-spacing: 0; line-height:26px; color:#b3aa7e;  padding-bottom:20px; }

#sidebar1 li {font: 5px 'AlfaSlabOneRegular', Arial, sans-serif; }
h2.style2 {font: 26px 'BevanRegular', Arial, sans-serif; color:#fff; line-height:26px; text-decoration:none; padding-left:15px; padding-right:15px; padding-top:20px; padding-bottom:10px;}

h2.style2 li a {padding-left:15px; padding-right:15px; padding-top:20px; color:#fff;}
#boxes li ul li a{
      color:red;
      width:130px;
      list-style-type:none;
      list-style-image: none;
      padding:0; margin:0;
}

ul.boxy1 li.nobullets{      list-style-type:none;
      list-style-image: none; position:relative;}
li.box02 a{color:#fff; width:100px;}
.white{color:#fff;}

p.style3 {font: 14px 'ArvoRegular', Arial, sans-serif;letter-spacing: 0; padding-bottom:10px; color:#3a2719;}
.smaller{font-size:18px; line-height:18px;}

a {text-decoration:none;}

#nav{
      padding : 0;
      margin : 0;
      position : relative;
      top:0;
      left : 318px;
      width:677px;
      height:35px;
      font: 15px 'ArvoBold', Arial, sans-serif;
      color:#b3aa7e;
      clear:both;
}

#nav ul {
padding : 0;
margin : 0;
list-style-type : none;
}

#nav li {
position : relative;
float : left;
list-style-type : none;
margin : 0;
font-weight:normal;
}
#nav li a {
height : 27px;
display : block;
text-decoration : none;
text-align : left;
line-height : 27px;
color : #3b2718;
padding-right:50px;
}

#nav li a:hover {

color : #b3aa7e;

}

 #nav .on {
color : #b3aa7e;
height:26px;


}






#mainContent ul ul li a:hover, #mainContent ul ul li a{
      list-style-type:none;
      padding:0;
      margin:0;
      list-style-image: none;
}

#mainContent ul ul {
position : absolute;
width:155px;
height:120px;
color:#fff;
visibility : hidden;
padding-left:10px;
margin-left:10px;
padding-top:10px;
font: 14px 'ArvoRegular', Arial, sans-serif;
}



#mainContent ul ul a, mainContent p a{font: 14px 'ArvoRegular', Arial, sans-serif; color:#fff; text-decoration:underline; padding-top:10px; width: 130px; list-style-type:none;}



#mainContent ul ul.boxy1 {background-color:#3b2719; top : 200px;}
#mainContent ul ul.boxy2 {background-color:#e9dd40; top : 200px;}
#mainContent ul ul.boxy3 {background-color:#6d3f6d; top : 200px;}
#mainContent ul ul.boxy4 {background-color:#a4beb6; top : 380px;}
#mainContent ul ul.boxy5 {background-color:#a69d82; top : 380px; }
#mainContent ul ul.boxy6 {background-color:#8388b4; top : 380px;}

#mainContent ul li:hover ul {
visibility : visible;
}

#sidebar1 ul li:hover ul {
visibility : visible;
}

.boxy1 li, .boxy2 li, .boxy3 li, .boxy4 li, .boxy5 li, .boxy6 li {
      list-style-type : none;
      padding-left:15px;
      background-image: url(images/bullet2.gif);
      background-repeat: no-repeat;
      background-position: left center;
      padding-bottom:5px;
}

#contact{width:300px; position: relative;  float:left; height:45px;}
#social{width:168px; position: relative;  float:left; height:45px;}
#search{width:200px; position: relative;  float:left; height:45px;}
#topheader{width:677px; float:left; position:relative; left:318px; top:20px; height:90px; font: 14px 'ArvoBold', Arial, sans-serif; color:#b3aa7e;}

.contact{font: 14px 'ArvoRegular', Arial, sans-serif; color:#000;}









#menu {
      padding:0; margin:0;
}
.caption { margin:auto; font-size:10px; text-align:center; }

/*      $__menu sidebar
      -------------------------------------------------*/
      #menu {
      width:290px;
      xpadding:3px 0 9px 0;
}
#menu ul {
      margin: 0;
      padding: 0;
      list-style-type: none;
}
#menu li {
      margin: 0;
      xmargin-left:19px; /*padding:8px 0 8px 0;*/
}
#menu li a {
      color:#333;
      text-decoration:none;
}
#menu li.active {
      xfont-weight:bold;
}
#menu li.active li {
      font-weight:normal;
} /*do not bold level 2 when parent is active*/
#menu li#current {
      font-weight:bold;
}

#menu a {
      display: block;
      xpadding: 5px .8em 6px .8em;
}
#menu ul li ul {
      width:285px;
      display:inline-block;
      
}
#menu li li {
      color:#999;
      padding-top:2px;
      padding-left:9px;
      xmargin:0 29px 0 29px;
      font: 13px 'ArvoRegular', Arial, sans-serif;
}
#menu li li a {
      color:#555;
      font-size:13px;
      line-height:13px;
}
#menu li li#current a {
      font-weight:bold;
}
/*OPTIONAL*/
      #menu {
      position:relative;
      height:300px;
      overflow:hidden;
} /*clip height pass 504 pixels*/

#sidebar1 ul ul { font: 13px 'ArvoRegular', Arial, sans-serif; color:#3a2719; padding-bottom:5px; list-style-type:none;}


#social ul li{
      position:relative;
         display:block;
         float:left;
         list-style-type:none;
         overflow:hidden;
   }
   
#social ul li a {
margin:0;
padding:0;
   display:block;
   height:27px; width:107px;
   background:transparent url(images/social) no-repeat 0 0;
   text-indent:-9009px;
      overflow:hidden;
   }
   
ul li#twitter a, ul li#twitter a:hover { width:36px; height:27px;     background-position: 0px 0px;    }
ul li#facebook a, ul li#facebook a:hover {   width:36px; height:27px;   background-position: -36px 0;    }
ul li#linkedin a, ul li#linkedin a:hover {   width:35px; height:27px;   background-position: -72px 0;    }


input {      border: 1px solid #000000; background-color:#e6e2d8; display:inline;}
form{width:200px;}
.centre {border:0; vertical-align:middle;}
bulletgrab.jpg
0
Comment
Question by:emmapap
2 Comments
 
LVL 12

Accepted Solution

by:
Kent W earned 500 total points
ID: 37783551
Take it out of the list items and set it's position with CSS?
0
 

Author Closing Comment

by:emmapap
ID: 37783908
I set its position within the list by putting a class on the <li>
0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Question about traversing a tree using jQuery 7 34
edit .asp files 5 31
I need help changing the colour of this image rollover please? 3 14
Bootstrap list items overlap 3 12
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to count occurrences of each item in an array.

820 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question