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
MANUEL CERNA
Courses Plus Student 4,739 PointsI am trying to style the dots, but I see numbered blocks instead. I have saved a print screen of what I see on the page
I can't seem to paste the screen shot. So here is my description:
I see these buttons on my page, but can't seem to locate them on index.html and remove them from web page.
<button type="button" data-role="none" class="slick-prev" style="display: inline-block;">Previous</button> <button type="button" data-role="none" class="slick-next" style="display: inline-block;">Next</button>
In addition, I have added the .slick-dots li styling on main.css, but dots do not display.
What displays are numbers 1, 2, 3 formatted as Previous and Next buttons (block with numbers inside). Is something overriding my styling and I can't see it.
MANUEL CERNA
Courses Plus Student 4,739 Points/index.html file/ <!DOCTYPE html> <html class="no-js"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Agency - A Treehouse template</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <!--CSS--> <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="js/slick/slick.css"
<link rel="stylesheet" href="js/slick/slick-theme.css"
<link rel="stylesheet" href="css/normalize.min.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<div class="row">
<header class="row header">
<div class="grid-third">
<a href="index.html" class="logo "></a>
</div>
<div class="grid-third tagline">
<h1 class="description">We build apps</h1>
</div>
<div class="grid-third">
<nav>
<a href="index.html">Home</a>
<a href="work.html">Work</a>
<a href="#" class="active">Team</a>
</nav>
</div>
</header><!--/header-->
<div class="main row">
<div class="grid-full">
<div class="team">
<h2>Meet the team</h2>
<h4>United we stand divided we fail</h4>
</div>
<!-- slides -->
<div class="slides">
<div>
<img src="img/team-members/team--01.png" alt="" class="avatar" />
<h3>Bill Bigsby IV</h3>
<p>CEO</p>
</div><!--/1-->
<div>
<img src="img/team-members/team--02.png" alt="" class="avatar" />
<h3>Jane Jewels</h3>
<p>CFO</p>
</div><!--/2-->
<div>
<img src="img/team-members/team--03.png" alt="" class="avatar" />
<h3>Doughy Digital</h3>
<p>Lead Developer</p>
</div><!--/3-->
<div>
<img src="img/team-members/team--04.png" alt="" class="avatar" />
<h3>Ralph Raider</h3>
<p>Lead Designer</p>
</div><!--/4-->
<div>
<img src="img/team-members/team--05.png" alt="" class="avatar" />
<h3>Nolan Nitro</h3>
<p>Senior Developer</p>
</div><!--/5-->
<div>
<img src="img/team-members/team--06.png" alt="" class="avatar" />
<h3>Donna Danger</h3>
<p>Senior Developer</p>
</div><!--/6-->
<div>
<img src="img/team-members/team--07.png" alt="" class="avatar" />
<h3>Rebecca Roo</h3>
<p>Senior Designer</p>
</div><!--/7-->
<div>
<img src="img/team-members/team--08.png" alt="" class="avatar" />
<h3>Lenny Lowes</h3>
<p>Senior Designer</p>
</div><!--/8-->
<div>
<img src="img/team-members/team--09.png" alt="" class="avatar" />
<h3>Eli Elfs</h3>
<p>Designer</p>
</div><!--/9-->
<div>
<img src="img/team-members/team--10.png" alt="" class="avatar" />
<h3>Trevor Tuesday</h3>
<p>Junior Developer</p>
</div><!--/10-->
<div>
<img src="img/team-members/team--11.png" alt="" class="avatar" />
<h3>Tori Traffic</h3>
<p>Project Mangagement</p>
</div><!--/11-->
<div>
<img src="img/team-members/team--12.png" alt="" class="avatar" />
<h3>Fido Fur</h3>
<p>Office Manager</p>
</div><!--/12-->
</div>
</div>
</div><!--/main-->
<footer>
<div class="row">
<div class="grid-full">
<p>Connect with us</p>
<ul class="social">
<li>
<a href="#" class="pink"></a>
<a href="#" class="light-blue"></a>
<a href="#" class="dark-blue"></a>
</li>
</ul>
</div>
</div>
</footer><!--/footer-->
</div>
<script src="js/jquery-1.11.2.min.js"></script>
<script src="js/slick/slick.min.js"></script>
<script>
$('.slides').slick({
dots: true,
slidesToShow: 4,
slidesToScroll:4
});
</script>
</body>
</html>
Steven Parker
231,248 PointsYour code uses several resources that are not included here, and your issue cannot be replicated with only the HTML.
To share everything at once, make a snapshot of your workspace and post the link to it here. If you're not already using workspaces, porting your project into one might be a good idea unless you have a live URL where it is hosted you can share.
MANUEL CERNA
Courses Plus Student 4,739 PointsSteven, Thanks for your help. I will send the files tomorrow. Have a great evening.
mc
MANUEL CERNA
Courses Plus Student 4,739 PointsSteven,
I resolved the issue. I had the normalize stylesheets in the incorrect order within the index.html file.
Thanks for your assistance.
mc
Steven Parker
231,248 PointsAck, I should have spotted that!
1 Answer
Steven Parker
231,248 PointsCongratulations on resolving your issue! 
I'm adding this as an answer so it will stop showing up in the "unanswered" category. You could also change the title to include [SOLVED] as an alternative to chosing a best answer as a way to indicate the issue is closed.
Steven Parker
231,248 PointsAwww shucks. 
Steven Parker
231,248 PointsSteven Parker
231,248 PointsIf you can't locate the buttons in the index.html, where did you get the code pasted in above
We will need to see more of the code to help with the style problem. Make a snapshot of your workspace and post the link to it here.