用css定位东西,与页面大小无关

时间:2013-05-31 13:11:31

标签: css positioning

所以我已经阅读了几本CSS指南并了解了大多数属性,但我仍然无法正确定位元素。

我的意思是:我现在使用marginmargin-rightmargin-leftpadding,(margin-left:50px)的特定值定位内容,等等......这意味着当我在我自己的计算机上以特定分辨率查看时,我div的所有位置都正确。

所以我希望这不是太笼统,但我如何按照他们将在页面中的相同位置,对于每个分辨率/页面大小,无论是谁和什么观看它来定位东西(我想如果99%的情况都是一样的,这也是一个好的开始。)

更具体一点:我可以用哪种属性以我描述的方式定位元素?

这是我的一个小项目的链接,这些项目位置不好(在我的屏幕上都很好,但对其他人来说不是很多: http://kash.hostzi.com/utopia/minesweeper.html

查看#gameTable的css例如 - 我想把它放在中心并以可怕的方式做到。

2 个答案:

答案 0 :(得分:1)

在您的链接示例中,您似乎希望游戏板居中。如果它是块级元素(例如div或table),并且您想要将其居中,则可以在元素本身上使用它:

margin-left: auto;
margin-right: auto;

如果它是内联元素,并且您希望将其居中,则可以在元素上使用它:

text-align: center;

如果您没有尝试将其居中,但只想使用屏幕尺寸进行位置缩放,请执行以下操作:

margin-left: 10%;
margin-right: 10%;

如果您希望使用字体大小缩放位置,请执行以下操作:

margin-left: 10ex;
margin-right: 10ex;

答案 1 :(得分:0)

您可以开始使用百分比。像:

margin-left: 20%;
margin-right: 20%;

并且它将根据窗口(它所在的元素)大小进行边距化。