Home > Web Front-end > HTML Tutorial > Weird div margins, terrible unsolvable problem, sincerely looking for answers_html/css_WEB-ITnose

Weird div margins, terrible unsolvable problem, sincerely looking for answers_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:17:29
Original
1101 people have browsed it


As shown in the picture above, the blue part is the background floating div, and the white part in the middle is the centered div. No margins are set.
My question is: Why are there margins above and below the white div part?
It’s so difficult to understand.


Reply to the discussion (solution)

Post the code and you won’t be able to tell anything by looking at it this way.

Cleared?

*{margin:0;paddding:0;}
Copy after login

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en">	<head>		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />		<title>show2</title>		<meta name="author" content="Administrator" />		<!-- Date: 2012-12-12 -->		<style>			body{			}			.alignCenter{				margin: 10px auto;				width: 950px;							}		</style>	</head>	<body>								<style>		._head{width: 100%; float: left}		a{display:inline-block;margin-left: 20px;text-align: center;font-family:"Arial" "黑体";color: white;}		.nv_logo{width: 950px;height: 128px;}		.logo{width: 246px;height: 128px;float: left}		.nv{width: 704px;height: 30px;padding-top: 98px;background-image: url(src/nv.png);background-repeat: no-repeat;float: left;background-position: -10px 80px;text-align: center;}		</style>		<div class="_head">			<div class="alignCenter">				<div class="nv_logo">					<!--logo-->					<div class="logo">						<img src="src/logo.png" />					</div>					<!--导航-->					<div class="nv">						<a style="height: 20px;width: 80px;">首页</a><a style="height: 20px;width: 80px;">关于火狼</a><a style="height: 20px;width: 80px;">服务项目</a><a style="height: 20px;width: 80px;">案例展示</a><a style="height: 20px;width: 80px;">客户服务</a><a style="height: 20px;width: 80px;">联系我们</a><a style="height: 20px;width: 80px;">VIP服务</a>					</div>				</div>						</div>		</div>						<style>		._center{width: 100%;background-image: url(src/background.png);float: left}		._center dl{padding-top: 20px;margin-left: 20px;width: 910px;}		._center dt{}		._center dd{border-style: solid;border-color: #FFFFFF; border-left-width:0px;border-right-width:0px; margin-left: 0px;margin-top: 20px;}		</style>		<div class="_center">			<div class="alignCenter" style="background-image: url(src/centerground.png);">				<dl>					<dt><img src="src/showcases.png" /></dt>					<dd>						<a></a>					</dd>					<dt style="text-align: right;"><a>上一页</a><a>下一页</a></dt>				</dl>			</div>		</div>						<style>		._bottom{width: 100%;background-image: url(src/bottom.png);height: 95px;background-repeat: repeat-x;padding-top: 0px;float: left}				</style>		<div class="_bottom">			<div class="alignCenter">							</div>		</div>							</body></html>
Copy after login

Cleared?
CSS code?1*{margin:0;padding:0;} I have tried this, margin:0px;padding:0px; but it doesn’t work. I just encountered this problem today. The code is posted on the third floor, please help me take a look, thank you

As shown in the picture above, the blue part is the background floating div, and the white part in the middle is the centered div. No margins are set.
My question is: Why are there margins above and below the white div part?
It’s so difficult to understand. Please help, the code is posted on the third floor

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template