Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


I can't get bullet points to go away on my HTML in my header?

<!DOCTYPE html> <html> <head> <meta charset="utf-8">
<title>Trista Ramirez |Teaching self Code</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Muli:400,400italic|Open+Sans:400italic,700italic,700,800,400' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Trista Ramirez</h1> <h2>Learning to Code</h2> </a> <nav> <ul> <li><a href="index.html" class="selected">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <ul id="gallery"> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with color and texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>Playing with images on photo shop.</p> </a> </li> <li> <a href="img/numbers.06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Trying to do 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips with photo shop.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating shapes.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/MOM_OF_3_HERE2COUPON"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/TrissR"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a> <p>Ā© 2015 Trista Ramirez.</p> </footer> </div> </body> </html>

/********* GENERAL **********/

body{ font-family: 'Open Sans', sans-serif; }

wrapper {

max-width: 940px; margin: 0 auto; padding: 0 5%; background: ; }

a { text-decoration: none; }

img{ max-width: 100%; }

/***************** HEADING *****************/


text-align: center; margin: 0; list-style-type: none; padding: 0px; margin: 0px; }

h1 { font-family: 'Muli', sans-serif; margin: 20px 0; font-size: 1.50em; font-weight: normal; line-height: 0.8em;


h2 { font-size: 0.75em; margin: -5px 0 0; font-weight:normal; }

/***************** NAVIGATION *****************/

nav { text-align: center; padding: 10px; margin: 20px 0 0; }

/***************** FOOTER *****************/

footer{ font-size: 0.75em; text-align: center; clear: both; padding: 50px; color: #ccc; }

/***************** PAGE PORTFOLIO *****************/

gallery {

margin: 0; padding: 0; list-style: none; }

gallert li {

float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }

gallery li a p {

margin: 0; padding: 5%; font-size: 0.75em; color: #bdc3c7; }

/**************** COLORS *****************/

/* site body */ body{ background-color: #fff; color: #999; }

/* logo text */ header{ background: #6ab47b; border-color: #599a68; }

/* nav background on mobile */ nav{ background: #599a68; }

/* logo text */ h1, h2 { color: #fff; }

/* links */ a { color: #6ab47b; }

/* nav link */ nav a, nav a:visited { color: #fff; }

*/ selected nav link */ nav a.selected, nav a:hover { color: #32673f; }

8 Answers

I think you are not adding style in order. Logo is not in a list item. It is in a header like your heading. You need to call your ul separately.

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

Did you try in CSS styles

list-style-type: none;

I just put that in the header and they are still there?


text-align: center; margin: 0; list-style-type: none; }


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

still there?? I have no idea what I did wrong? After watching the tutorials I see the same code in my html and css but obviously not because its not working?

I added an additional comment with my CSS code if you have a chance to review it?

You need to write separate line of code for ul. like ul { list-style-type: none; padding: 0px; margin: 0px; }

you are still inside logo{ ... }

OMGOSH your a genius!!! They are gone THANK you so much!!