Div在IE和Chrome中的显示方式有所不同 [英] Div displays differently in IE and Chrome
问题描述
显示div时发生了非常奇怪的事情.在IE中，它的显示应该是应该的，但是在Chrome中，它会稍微下移.这就是IE中的样子:
Something very strange is happening when displaying a div. In IE, it displays like it's supposed to, but in Chrome it is shifted down slightly. Here's what it looks like in IE:
在Chrome中:
您会注意到，在chrome中，内容div略微向下移动.为什么Chorme会这样做?
You will notice that in chrome the content div is shifted down slightly. Why is Chorme doing this?
这是我的代码:
<?php include "headermysql.php"?>
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<script type = "text/javascript">
function to_login_page()
{
window.location.assign("http://127.0.0.1/sxp/login.php");
}
function to_signup_page()
{
window.location.assign("http://127.0.0.1/sxp/signup.php");
}
</script>
<link rel = "stylesheet" type = "text/css" href = "textstyles.css">
</head>
<body>
<?php include "headerhtml.php";?>
<div class = "menu">
<p>menu</p>
</div>
<div class = "content">
<?php
//irrelevant PHP code
?>
<a class = "main" href = "post.php">Post new topic</a>
</div>
<div class = "footer">
<p class = "footer">Copyright imulsion 2013</p>
</div>
</body>
</html>
CSS:
div.header
{
height:150px;
background-color:#008AC8;
}
div.menu
{
float:left;
width:200px;
height:800px;
background-color:#64BCE2
}
div.content
{
height:800px;
background-color:#F9F9D9;
}
div.footer
{
height:20px;
background-color:#008AC8;
}
推荐答案
我怀疑是< p>元素，它通常具有隐式边距或填充.尝试使用开发人员工具"-IE和Chrome都有自己的版本，并验证是否存在问题.如果是这样，则删除< p>标记或添加规则以删除边距和填充，并按照@Stacey Garrison的建议完全设置它们，除了p而不是body和html.
I suspect it's the <p> element, it often has an implicit margin or padding. Try the "developer tools" - both IE and Chrome have their own versions, and verify if that's the problem or not. If so, then either remove the <p> tag or add a rule to remove the margin and padding and set them exactly as @Stacey Garrison suggests except for the p instead of body and html.
这篇关于Div在IE和Chrome中的显示方式有所不同的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
