I am having a problem with my HTMl/CSS. it seems like my body tag has somehow got a margin-top of 10px... However I cannot find anyway to get rid of it. The other websites I have built has never done this, so any help would be appreciated.
THE CODE:
HTML
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="js_plugins/skrollr.js"></script>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="text.css">
<title>MyPage</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div id="maincontent">
<section id="maincontent-sect-intro" >
<div id="maincontent-sect-intro-content">
<p class="name-intro">Introduction</p>
</div>
</section>
</div>
</body>
</html>
CSS
body
{
width: 100%;
margin: 0px;
}
div#maincontent
{
min-width: 1000px;
width: 100%;
}
section
{
margin-top: 0px;
height: 550px;
width: 100%;
}
/*
For intro section
*/
section#maincontent-sect-intro
{
background-color: #666666;
text-align: center;
}
div#maincontent-sect-intro-content
{
text-align: center;
}
Your problem here is the p class "name-intro" <p> tags automatically give a margin top of 1em. just add this to your css
.name-intro {
margin: 0;
}
also a rule of thumb, when specifying 0 values, never add pixel or em, just leave it as zero :)
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다