Css style <ul> not working properly - html

Question

Hi guys I really cant figure out why the images on my <ul> wont work.
I need to style the ul with a class but the <li> keeps looking the same.
Here is my css code:
body{padding:0;margin:0; background:#39424b; font-family: verdana;}
h1, h2{padding:0;margin:10px 0 10px 0;}
h1 {font-size: 150%;}
h2 {font-size: 110%;}
p{padding:0; margin:0 0 5px 0;}
a {color:#176092; text-decoration:none;}
a:hover {text-decoration:underline;}
#wrap {width:960px; margin: 0 auto; background:#999;}
#header, #footer {background: #0f1923; color:#fff; padding:10px 40px;}
#footer p {font-size:80%; text-align:right;}
#content {background:#ccc; padding:10px 40px;}
pre {font-size:85%; background:#fff; border:1px #ccc solid; padding:5px}
#checkjul ul {
list-style-image: url('http://dorchdanola-netbutik.dk/Resources/Files/general/checkbox-jul.png');
padding-left: 25px;
margin-bottom: 10px;
height: 19px;
}
#slide-out-div-jule-holder {
width: 600px;
height: 270px;
margin: 20px;
margin-top: 10px;
Here is my html code:
<div class="slide-out-div">
<a class="handle" href="http://link-for-non-js-users">Julehandel</a>
<div style="float:left" class="slide-out-div-jule-holder">
<b>Køb julegaver hos Dorch & Danola<br /> - Nemt, Sikkert og billigt!</b>
<ul class="checkjul"><li>E-mærket kontrolleret webshop for sikker handel</li>
<li>Vi bytter alle ordre købt fra 20. oktober frem til og med den 15. januar 2015</li>
<li>Gratis ombytning af Julegaver - Vi sender returlabel </li>
<li> Sidste bestillingsdato for julegaver er den 22. december.</li>
<li> Hurtig levering - Fragt fra Kr. 39,-</li>
<b>Dorch & Danola ønsker alle en glædelig jul og et rigtig godt nytå</b></ul>
</div></div>

Answer 1

So it doesn't work because you are styling #checkjul ul but you don't have such an element. So to work you need to add those styles to your ul class .checkjul and it will work :)
body {
padding: 0;
margin: 0;
background: #39424b;
font-family: verdana;
}
h1,
h2 {
padding: 0;
margin: 10px 0 10px 0;
}
h1 {
font-size: 150%;
}
h2 {
font-size: 110%;
}
p {
padding: 0;
margin: 0 0 5px 0;
}
a {
color: #176092;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
#wrap {
width: 960px;
margin: 0 auto;
background: #999;
}
#header,
#footer {
background: #0f1923;
color: #fff;
padding: 10px 40px;
}
#footer p {
font-size: 80%;
text-align: right;
}
#content {
background: #ccc;
padding: 10px 40px;
}
pre {
font-size: 85%;
background: #fff;
border: 1px #ccc solid;
padding: 5px
}
.checkjul{
list-style-image: url('http://dorchdanola-netbutik.dk/Resources/Files/general/checkbox-jul.png');
padding-left: 25px;
margin-bottom: 10px;
height: 19px;
}
#slide-out-div-jule-holder {
width: 600px;
height: 270px;
margin: 20px;
margin-top: 10px;
}
<div class="slide-out-div">
<a class="handle" href="http://link-for-non-js-users">Julehandel</a>
<div style="float:left" class="slide-out-div-jule-holder">
<b>Køb julegaver hos Dorch & Danola<br /> - Nemt, Sikkert og billigt!</b>
<ul class="checkjul">
<li>E-mærket kontrolleret webshop for sikker handel</li>
<li>Vi bytter alle ordre købt fra 20. oktober frem til og med den 15. januar 2015</li>
<li>Gratis ombytning af Julegaver - Vi sender returlabel</li>
<li>Sidste bestillingsdato for julegaver er den 22. december.</li>
<li>Hurtig levering - Fragt fra Kr. 39,-</li>
<b>Dorch & Danola ønsker alle en glædelig jul og et rigtig godt nytå</b>
</ul>
</div>
</div>

Answer 2

You have
<ul class="checkjul">
but you are defining your style as an ID, and applying it to the wrong element:
#checkjul ul
For this to work, you will need:
.checkjul li