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

HTML How to Make a Website Creating HTML Content Include External CSS

Posted by Craig Kendricks
Craig Kendricks
3,413 Points

Bullet point removal (normalize.css)

Stage 3: Creating HTML Content Video: Including External CSS

In this video, Nick adds normalize.css to clear any formatting across browsers. He points out that the bullet points on the Navigation menu have been removed, but when I add normalize.css they do not.

I checked in both Firefox and Chrome, and they are still present. (I downloaded the normalize.css they provide at the bottom resource link)

Thanks!

2 Answers

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

The reason for this difference is the version differences between the current version (v3) of normalize.css and the version that Nick Pettit is using in the video (v1).

This is a point of common confusion with this video.

Craig Kendricks
Craig Kendricks
3,413 Points

I see, thank you James.

Can you possibly tell me the most logical way to easily remove them in my CSS?

Thanks for your help :)

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Craig Kendricks -

Can you possibly tell me the most logical way to easily remove them in my CSS

If I recall correctly it's covered shortly in the course.

It's very easy.

ul, ol { list-style: none; }
Craig Kendricks
Craig Kendricks
3,413 Points

I actually ran into it just now in the "Style the Portfolio" video.

However, I tried it the way you show as well as the way he shows (same code, but he just placed it inside the ID of the div he was modifying), but when I do it and refresh my page, the bullet points are still showing.

Is it possible my browsers are caching them somehow? I opened it in both Firefox and Chrome and tried refreshing both.

August Anna Copeland
August Anna Copeland
589 Points

I fixed it easy enough by copy/pasting the nav ul section at line 316 of normailze.css and changing nav to section so that it looks like this. 

nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
}
section ul,
section ol {
    list-style: none;
    list-style-image: none;
}
zakaria Boumarouane
PLUS
zakaria Boumarouane
Courses Plus Student 2,358 Points
zakaria Boumarouane
zakaria Boumarouane
Courses Plus Student 2,358 Points

Hi All, I tried the solution suggested by August Anna Copeland, but it's still not showing the bullet points