?
Solved

Div layer leaving left gap on very simple code

Posted on 2009-02-12
1
Medium Priority
?
349 Views
Last Modified: 2013-12-25
Hi, I am attaching some very simple html code. When I run that source I keep getting a gap to the left side of each div tag. I have demonstrated my issue below by showing a nested div and also a div alone in the body. I do not want a gap to the left.

Very simple! please help!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
#wrapper {
	width: 100%;
}
#header {
	background-color: #990000;
}
#alone {
	background-color:#3300FF
}
body {
	background-color: #996633;
}
-->
</style>
</head>
 
<body>
<div id="wrapper" align="center">
  <div id="header">Why is there a gap on top and left? (this is the nested div)</div>
</div>
<div id="alone">I dont want a brown gap on the left. (this div is not nested)</div>
 
</body>
</html>

Open in new window

0
Comment
Question by:cactuses37
1 Comment
 
LVL 2

Accepted Solution

by:
LordWolfy earned 500 total points
ID: 23630323
Try changing your css to the following (it may seem simple and repetitive but I always set certain values for every css class):


<style type="text/css">
<!--
#wrapper {
        display: block;
        position: relative;
        padding: 0px;
        margin: 0px;
        width: 100%;
}
#header {
        display: block;
        position: relative;
        padding: 0px;
        margin: 0px;
        background-color: #990000;
}
#alone {
        display: block;
        position: relative;
        padding: 0px;
        margin: 0px;
        background-color:#3300FF
}
body {
        display: block;
        position: relative;
        padding: 0px;
        margin: 0px;
        background-color: #996633;
}
-->
</style>

Open in new window

0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
Although a lot of people devote their energy toward marketing for specific industries, there are some basic principles that can be applied to any sector imaginable. We’ll look at four steps to take and examine how those steps were put into action fo…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
This video shows how to quickly and easily deploy an email signature for all users in Office 365 and prevent it from being added to replies and forwards. (the resulting signature is applied on the server level in Exchange Online) The email signat…
Suggested Courses

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question