I'm currently designing a feedback form and I would like to add a shadow effect to it. I'm having trouble removing the white space so that my "top" image appears more like a shadow rather than just hovering over the form. I've attempted using display block 0, but it doesn't seem to be working. Any suggestions?
.container {
background: #fff;
border: 1px solid #ccc;
margin: auto;
text-align: left;
width: 700px;
}
.alignCenter {
margin: 1em;
}
h1 {
background-color: #dedede;
margin: 0;
min-height: 0;
padding: 0;
text-decoration: none;
text-indent: -8000px;
}
.form_margin {
margin-bottom: 1.5em;
margin-top: 3px;
}
body {
background: #ffffff;
font-family: "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
font-size: small;
margin: 8px 0 16px;
text-align: center;
}
.heading {
font-family: Lucida Grande, Tahoma, Arial, Verdana, sans-serif;
font-size: small;
}
.message-up {
vertical-align: top !important;
}
.form_description {
border-bottom: 1px dotted #ccc;
clear: both;
margin-bottom: 1em;
}
.headerImage {
display: block;
margin: 10px auto 0;
}<!DOCTYPE html>
<html>
<head lang="en">
<link rel="stylesheet" type="text/css" href="css.css">
<meta charset="UTF-8">
<title>Welcome to The Mystery Man Website</title>
</head>
<body>
<div class="headerImage">
<img src="Images/top.png" alt="top" width="710 ">
</div>
<div class="container">
<h1>grey bar</h1>
<div class="alignCenter">
<form action="" method="post">
<div class="form_description">
<h2>User Feedback Form</h2>
<p>Your suggestions are very appreciated</p>
</div>
<!-- Name -->
<strong><label for="username">Name</label></strong>
<div class="form_margin">
<input type="text" name="username" size="30" id="username" placeholder="Your Full Name" />
</div>
<!--Email-->
<strong> <label for="email">Email</label> </strong>
<div class="form_margin">
<input type="email" name="email" size="30" id="email" placeholder=" Your Email" />
</div>
<!--Feedback-->
<strong> <label for="feedback">Feedback</label> </strong>
<div class="form_margin">
<textarea rows="10" cols="93" name="feedback" id="feedback" placeholder="Your Comments.."></textarea>
</div>
</form>
</div>
</div>
</body>
</html>