html - 边缘底部不想在 Opera 和 Safari 中工作

标签 html css safari margin opera

我是网页设计新手,我一直在做这段代码 html/css ,它是关于 css 中的边距的,它看起来确实很简单,但是 margin-bottom 并不在所有浏览器中都工作。我在 Chrome、Internet Explorer 11、Firefox 中测试了它,它可以工作,但在 Opera 和 Safari 中不起作用。我不知道我犯的错误是因为我是菜鸟还是因为浏览器。

这是我的代码 HTML:

<!DOCTYPE html>
<html>
<head>
   <title>CALCULADORA DE CREDITOS - CECyT No. 1 "GONZALO VAZQUEZ VELA" DEL IPN</title>
   <link rel="stylesheet" media="screen" href="prueba.css">
</head>

<body>
   <div id="wrapper">
      Hellow ,i'm a DIV!
   </div>
</body>
</html>

这是我的 CSS 'prueba.css':

*{margin:0;
padding:0;}


html,body{height:100%;}


body{margin:4%;}

#wrapper{
margin:0 auto 0 auto;
background-color:gray;
width:60%;
height:100%;
}

最佳答案

删除这些部分:

html,body{height:100%;}
body{margin:4%;}

在将元素设置为特定大小时,仅当您在所选元素上使用“position:fixed”时才使用百分比。

改为在元素本身中设置边距,并且仅当元素上有“位置:固定”时才以百分比设置元素。

JSFiddle Demo

关于html - 边缘底部不想在 Opera 和 Safari 中工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22159736/

相关文章:

html - 列表的 Css 计数器

css - 未记录的断字 : break-word CSS property?

html - 在带边框的元素上使用时转换 scale() Safari 错误

Safari 和 Chrome 中的 CSS 菜单问题。除非你真的很快,否则子菜单会在悬停时消失!

html - 使用宽度和高度属性缩放图像以适合指定的矩形

javascript - 检测浏览器对动画 GIF 图像的支持

css - 在 IE 的 div 中居中元素

html - 如何创建具有不同大小的 Angular 的输入框?

html - 使用什么技术来显示这些优雅的可点击选项?

html - 标题左侧 float 图像的CSS