Question

我的login.css在这里：

#contentContainer{

margin-top: 10%;

}

这是我的PHP文件：

  <div align="center" id="contentContainer">
        <div id="Login_Cont"></div>
        <div class="login_logo"></div>

  </div>

我把我网站的内容放在一个大的div中，我称之为contentContainer。现在，我如何能够以任何分辨率调整我的网站内容，我已经尝试过媒体屏幕技巧/ css技巧，但它不起作用。请帮我。

Answer 1

所以你希望contentContainer浮在屏幕中间？

这是你想要的事情：

#contentContainer {
background-color: #ccc;
height: 300px;
left: 50%;
margin-left: -150px;
margin-top: -150px;
position:absolute;
top: 50%;
width: 300px;
}

Answer 2

您可以像

那样给出容器宽度百分比

#contentContainer{
   width:100%;//likewise
   margin:auto;//to center your div
}

或最佳使用媒体查询

@media screen and (max-device-width : 320px)
{

}//likewise define for each screen resolution

如何在任何分辨率CSS中适合网站的内容

2 个答案: