css div class inside id - html

Question

i'm having problems using my css page, where it should be a almost white background it doesnt show in my class. my code:
<div id="content">
<?php
$query="SELECT * FROM softwares ORDER BY Idsoft DESC LIMIT 5";
$result=mysqli_query($ligabd,$query);
while ($rows=mysqli_fetch_array($result))
{
$id=$rows["Idsoft"];
$a1=$rows["nome"];
$a2=$rows["marca"];
$a3=$rows["preco"];
$a4=$rows["stock"];
$a5=$rows["img"];
?>
<div class="img">
<a href="productprofile.php?id=<?php echo $id; ?>">
<img src="<?php echo $a5;?>" width="110" height="90">
<div class="desc"><?php echo "".$a2." - ".$a1.""?></div>
</a>
</div>
<?php
}
?>
</div>
and here my css:
#content
{
width: 500px;
width: 80%;
height:1000;
margin: 0 auto 0 auto;
background-color:#999
overflow:hidden;
background-size:1980px 1080px;
}
and for the image tiles:
div.img
{
margin:5px;
padding: 5px;
border:1px solid #0000ff;
height:auto;
width:auto;
float:left;
text-align:center;
}
div.img img
{
display:inline;
margin:5px;
border:1px solid #ffffff;
}
div.img a:hover img
{
border:1px solid #0000ff;
}
div.desc
{
text-align:center;
font-weight:normal;
width:120px;
margin:5px;
}
my problem is that the background in the content should appear under the class, but i cant make it work, already tried to instead of using a class using an id but i cant format. i'll be appreciated by who helped me!

Answer 1

Your CSS:
#content {
width: 500px;
width: 80%; //Why multiple declaration?
height:1000; //Forgot unit i.e px or %
margin: 0 auto 0 auto;
background-color:#999 //Missed semicolon
overflow:hidden;
background-size:1980px 1080px; //Consider removing it if you aren't using background image.
}
div.img {
margin:5px;
padding: 5px;
border:1px solid #0000ff;
height:auto;
width:auto;
float:left;
text-align:center;
}
div.img img {
display:inline;
margin:5px; // this will not be of any effect. Margin is ignored for inline elements
border:1px solid #ffffff;
}
div.img a:hover img {
border:1px solid #0000ff;
}
div.desc {
text-align:center;
font-weight:normal;
width:120px;
margin:5px;
}
Corrected CSS:
#content {
width: 500px; // Or 80%
height:1000px;
margin: 0 auto 0 auto;
background-color:#999;
overflow:hidden;
}
div.img {
margin:5px;
padding: 5px;
border:1px solid #0000ff;
height:auto;
width:auto;
float:left;
text-align:center;
}
div.img img {
display:inline;
border:1px solid #ffffff;
}
div.img a:hover img {
border:1px solid #0000ff;
}
div.desc {
text-align:center;
font-weight:normal;
width:120px;
margin:5px;
}

Answer 2

Okay, it seems like you have some errors in the CSS. In the first CSS code block (#content {}) you are:
Missing a semi-colon after background-color:#999, this is the reason why it isn't working as expected.
Using two width properties
Setting a height value without specifying the unit (px, %, etc.).
Using background-size without using a background image, it won't work on a background color.
Also remember that you can shorten margin: 0 auto 0 auto; to margin: 0 auto;
Working JSFiddle example.