I have a question regarding CSS and how to bequeath background information within an unordered list.
I have a footer in that I would like to show different flags. there I have a footer class
<ul class="flag">
<li id="de"></li>
</ul>
.flag
consists of:
.footer #legals #list2 .flag{
width: 20px;
height: 10px;
display: inline-block;
float:left;
margin-top: 16px;
margin-left: 15px;
background-image:url(../images/flags.png);
}
.footer #legals #list2 .flag #de{
background-position: -40px;
}
.footer #legals #list2 .flag #en{
background-position: -20px;
}
.footer #legals #list2 .flag #en_us{
background-position: -20px;
}
So I thought it would be easier for each flag just to change the entry background-position
.
But for some reason this is not working and I dont know why? I also tried to use instead of li id
div id
but it is still the same.
If there is someone who could help me out I really would appreciate it.