Slick Slider arrows appearing as generic buttons

Question

I'm using Slick and I'm having issues with the dots and buttons. They appear outside the Slick frame as generic buttons. Accessibility also isn't working. Edit: Accessibility not working was caused by the slider not having focus.

Here's my Slick code:

$(document).ready(function(){
   $(".single-item").slick({
       accessibility: true,
       arrows: true,
       dots: true
   }); 
});

and here's my slider code as well as the JS that generates it:

<div class="single-item" id="slideshow">

</div>

for (var i = 0; i < images.length; i++)
{
    $("#slideshow").append("<div><img onclick='cover(this)' src='" + images[i] + "'></div>");
}

Answer 1

你是否包括slick-theme.css以下文件slick.css ？