我是新来创建网站,似乎无法找出为什么我的网站对齐方式无法正常工作。我的网站不会正确对齐放大和缩小
在所有这三个我的电脑显示器,该网站看起来不错:
但我看了一下我的一个朋友的电脑上,它看起来是错误的。
我有一个主体,然后在右侧和左侧的空间,但根据我使用显示器上,出现了不同的空间,它看起来坏...
任何人都可以看看我的代码,看看我做错了什么?
的index.html - >
<html>
<head>
<title>Spectanium Studios</title>
<link rel="stylesheet" type="text/css" href="default.css" />
</head>
<body>
<div id="header">
</div>
<div id="menu">
<ul>
<a href="http://www.spectanium.com/">Homepage</a><li><a href="/Spectanium%202/products.html">Products</a></li>
<li><a href="/Spectanium%202/aboutus.html">About Us</a></li>
</ul>
</div>
<div id="content">
<div id="updatesCol">
<h2>Recent Updates</h2>
<h3> * Website Created *</h3>
<p></p>
<p style="font-size:small">Website is now done!</p>
</div>
<div id="contentCol">
<h2>Welcome to Spectanium!</h2>
<p>
<em>So far we have to do a few things before we are ready to roll!</em>
</p>
<h3>Game Stuff:</h3>
<ol>
<li>Finish the actual game.</li>
<li>Get final graphics.</li>
<li>Get final music.</li>
<li>Find out distribution method.</li>
</ol>
<h3>Website Stuff:</h3>
<ol>
<li>Write descriptions for about us.</li>
<li>Improve it</li>
<li>Make it pretty</li>
</ol>
</div>
<div style="clear: both;"></div>
</div>
<div id="footer">
<p></p>
<p> © 2014 Spectanium Studios</p>
</div>
</body>
</html>
default.css - >
body {
margin: 20px 0;
padding: 0;
background: black;
background-image:url('images/background.png');
background-size:100%;
background-repeat:repeat-y;
width:190%;
font: normal "Courier New", Courier, Courier, sans-serif;
}
h1, h2, h3 {
color: #B13413;
}
h2 {
font-size: 1.6em;
}
h3 {
margin: 0;
font-size: 1em;
}
p, ul, ol, blockquote {
margin-top: 0;
}
a:link {
border-bottom: 1px dotted #CCCCCC;
text-decoration: none;
color: #3284B5;
}
a:hover {
border: none;
}
img {
border: none;
}
/* Header */
#header {
width: 890px;
height: 273px;
margin: 4px 0 4px 300px;
background: url(images/header.png) no-repeat;
}
/* Menu */
#menu {
background: url(images/topborder.png) repeat-x;
width: 950px;
height: 41px;
margin: 0 auto;
margin-left:275px;
background-color: #a1a1a1;
}
#menu ul {
margin: 0;
padding: 0;
list-style: none;
text-decoration:none;
}
#menu li {
display: inline;
text-decoration:none;
}
#menu a {
display: block;
float: left;
height: 28px;
padding: 15px 20px 0 20px;
text-decoration: none;
color: black;
font-weight:bold;
border-bottom: 0 dotted #DDDDDD;
}
#menu a:hover{
height:8px;
color: #B13413;
}
/* Content */
#content {
background: url(images/bottomborder.png) repeat-x;
width: 950px;
background-color: white;
margin-left:275px;
height: 1000px;
}
#updatesCol {
float: right;
width: 250px;
height:1000px;
border-left:1px black solid;
text-align:center;
}
#contentCol {
float: left;
width: 500px;
padding: 20px 0 0 0;
margin-left:25px;
}
/* Footer */
#footer {
width: 950px;
margin: 0 auto;
margin-left:275px;
padding: 10px 0;
font-size: smaller;
background: url(images/bottomborder.png) repeat-x;
clear:both;
}
#footer * {
color: #666666;
}
这对我来说很不错... – Jatin
这是什么? 0.o也许这是在我尝试过的其他3台电脑上出现错误... hmpf – AllKeggedOut
这个问题只针对一个浏览器还是针对所有人? –