Question

我正在尝试使用绝对定位使div具有宽度，并且它在谷歌浏览器中工作正常但在fierfox中它没有。为什么会有冲突？我在浏览器和fierfox上尝试了完全相同的代码并没有重新调整它。

   <!DOCTYPE HTML>
<html >
    <head>
        <meta charset="utf-8"/>
        <title>Kelma</title>
        <link rel="stylesheet" href="style.css" />
    </head>
    <body>

            <input type="text" id="center" />
    </body>
</html>

这是css文件

#center{
    position: absolute;
    left:50px;
    right: 50px;
}

Answer 1

看看这个：

<!DOCTYPE HTML>
<html >
    <head>
        <meta charset="utf-8"/>
        <title>Kelma</title>
        <link rel="stylesheet" href="style.css" />
        <style>
            #wrapper
            {
               position: absolute;
               left:50px;
               right: 50px;
            }
            #center
            {
               width:100%;
            }
        </style>
    </head>
    <body>
        <div id="wrapper">
               <input type="text" id="center" value="test" />
        </div>
    </body>
</html>

我使用div包装输入，然后将样式应用于div，并将100％宽度应用于输入。

Answer 2

试试这个：

#center{
  position: absolute;
  left:0px;
  width: 100%;
}

Answer 3

我已经使用内联css

了

这是我个人网站的一个例子

<div style="position:absolute; top:60px; bottom:5%; left:5%; right:5%; width:90%; text-align:center;"> SOME TEXT </div>

我个人喜欢使用百分比，因为它可以在某些网站上看起来更好看。如果这对您有用，请告诉我！要查看它：http://cbogausch.com/portal它适用于firefox和chrome

Answer 4

这不是你的意思吗？

body{padding: 0 50px;}
input{width:100%;

Answer 5

在你的css上使用它：

#center {
   margin: 0 auto;
   width: 90%;
}

HGS， Vinicius =）

同时左右定位div

5 个答案: