Dylan Hobday Dylan Hobday - 1 year ago 74
CSS Question

background color for <div id = "box"> wont show

I'm working on a small project and I've encountered an issue were the background color for a div that I have isn't showing.


<!doctype html>
<title>Hello, World!</title>
<link rel="stylesheet" type="text/css" href="styles/index.css" />
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>
<div id="wrapper">
<div id = "box">
<h1 id="head">Hello, World!</h1>
</div> <!--Box-->
</div> <!--wrapper-->
<script src="js/Index.js" type="text/javaScript"></script>


body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;

#wrapper {
width: 100%;
height: 100%;

#Box {
background-color: #EEE;
Width: 100px;
Height: 100px;

#head {
font-size: 15pt;

I've never had an issue like this and any insight would be greatly appreciated. Thanks.

Answer Source

You need to make sure you are using the same case, classes and id's are case sensitive:

Change #Box to #box

See fiddle https://jsfiddle.net/7ku7qvfx/12/

#box {
    background-color: #EEE;
    Width: 100px;
    Height: 100px;


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download