Omar Al-Ali Omar Al-Ali - 3 months ago 10
CSS Question

solved div class logo isn't showing

I am having a problem with showing the logo. Here's my html code:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>title</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div class="logo"></div>

</body>
</html>


Here's the CSS code:

body {
background: #43C6DB;
}

.logo {
background: url('../logo.png') no-repeat;
}

Answer

Div elements by default have no height unless you explicitly specify it. You could put your logo as an image in the div which would give you more control over how it looks inside your div. But to solve your problem you can add this to your css.

.logo {
background: url('../images/logo.png') no-repeat;
height:100px; /*Height of your image*/
}

Here's a quick example http://codepen.io/anon/pen/WxWAEZ

Cheers and happy coding.