保持窗口大小调整后网页不移动的内容

-3

当我重新调整网页大小时，我的网站www.toontownclassic.com 出现问题，所有文本都移到页面左侧。我想保持#Date & By和#NewsPosts不会移位。这是我的代码。保持窗口大小调整后网页不移动的内容

CSS

html, body { 
width: 100%; 
height: 100%; 
background-image:url(../images/Background.jpg); 
background-repeat: no-repeat; 
} 

#container { 
left: 50%; 
width:400px; 
/* margin-top:260px; 
margin-left: -200px; 
position: fixed; 
} 


#DateAndBy { 
width: 75%; 
/* margin-top:260px; If you want to use the margin-top */ 
margin-left:auto; 
margin-right:auto; 
text-align: center; 
padding: 30px; 
} 

#NewsPosts { 
width:100%; 
left: 0; 
right: 0; 
text-align: center; 
overflow: hidden; 
background:#fff; 
}

HTML

<!--DateAndBy--> 
     <div id="DateAndBy"> 
      <p>Posted By: Tester1223465 on October,21,2014</p> 
      </div> 
      <div id="container"> 
       <div id="NewsPosts"> 
        <p>uhbbyubuybybuiy</p> 
       <br> 
       <br> 
       <br> 
       <br> 
       <b><u>WEBSITE CHANGELOG</u></b> 
       <li>Extended Border size for the news container</li> 
       <li>Text now appears like it would be in news articles</li> 
       <li>Added Logo for Toontown Classic.</li> 
       <li>Font is now Serif as it used to be Arial</li> 
       <li>Fixed spelling errors in code causing website to not re-size   properly</li> 
      </div>

来源

2014-10-29 Mashla X

如果使用固定的元素维度，而不是动态的那么他们将不会与视调整，因此这些元素内的内容不会移动。 – Zack 2014-10-29 00:28:30

代码的第一个错误是您没有足够的空间来处理页面的行为。您错过了HTML5和CSS3的原则。我会考虑研究codeacademy.com和bootstrap。开始缓慢 – LOTUSMS 2014-10-29 00:29:17

-1

如果它是在在toontownclassics.com此刻不在线的网站，那么至少可以歌剧无法正确渲染它在所有。

你想让整个页面居中吗？在这种情况下，我建议您将所有DIV元素放在它自己的“包装器”-DIV中，并使用CSS来居中。

<div id="wrapper"> 
    <!-- all other DIV's here --> 
</div>

，并加入到样式表：

#wrapper { 
    margin: 0 auto; 
    width: 800px; 
} /* Replace 800px with whatever you want */

请让我知道如果我完全误解你。

我会建议你快速浏览一下这些介绍：

HTML5 Introduction at W3 Schools

CSS3 Introduction at W3 Schools

来源

2014-10-29 00:32:02

保证金：自动0;是不一样的边距：0自动。他需要的不仅仅是一个包装类。并且800px对于内容来说不是一个好的宽度。正确的是在1024px ad 1170px之间，尽管970px在构建在表格布局上的非响应系统中也很受欢迎，而这又是构建网站的一种可怕方式。 – LOTUSMS 2014-10-29 01:01:51

保持窗口大小调整后网页不移动的内容

回答

相关问题