Forum Moderators: not2easy
but it seems that only the first div gets the background, while others get nothing.
If this is the proper behavior, can someone explain the details to me, I don't understand it.
Also if there's a workaround to accomplish what I'm looking for that would be good too.
Here's some sample code. when I look at this in firefox, only the first div (class="BGImages") gets the background. The other div of the same class has no background
Thanks in advance
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
.BGImages {
float: left;
height: 200px;
width: 200px;
border: 1px solid #0000FF;
background-attachment: fixed;
background-repeat: no-repeat;
background-image: url(/images/anImage.jpg);
}
.BGImages a img {
padding: 20px;
padding: 15px 30px 30px 30px;
border: none;
}
</style>
</head>
<body>
<div class="BGImages"><a href="#"><img src="/images/theTopImage.png" width="25" height="25"></a></div>
<div class="BGImages"><a href="#"><img src="/images/theOtherTopImage.png" width="25" height="25"></a></div>
</body>
</html>
Note: You have declared padding: twice in the same declaration. That should be fixed, though has no bearing on the question posed.
.BGImages a img {
padding: 20px;
padding: 15px 30px 30px 30px;
As for the padding, I just added the new line for testing and forgot to update it when posting the code here.