позиционирование div справа и слева одновременно

Я пытаюсь сделать div иметь ширину, используя абсолютное позиционирование, и он отлично работает в google chrome, но в fierfox он не делает. почему существует конфликт? Я пробовал точно такой же код в обоих браузерах, и на fierfox его не переконфигурировал.позиционирование div справа и слева одновременно

<!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; 
}

источник

2013-04-05 Oussama Bouthouri

вход AFAIK не имеет ширину, он принадлежит к строковому elemens – user907860

Это выглядит прямо ко мне; Я не уверен, почему он терпит неудачу. Если он не работает в Firefox, что он делает неправильно? – user1618143

@caligula: Я определенно поместил ширину на элементы ввода текста раньше. Как еще вы должны установить ширину ваших текстовых полей? – user1618143

Взгляните на это:

<!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% ширина до входа.

источник

2013-04-05 18:28:14 trajce

Я считаю, что исходный код не работал в FF из-за того, как обрабатываются поля и позиции текстовых полей. Обернув его, вы принудительно изменяете ширину. – jtalarico

спасибо, что это вокинг, но почему?! Я действительно хочу понять, почему не на fierfox. –

Из того, что я пробовал, Абсолютное позиционирование работает странно в браузерах, когда вы устанавливаете левое и правое смещения (до значения больше нуля), даже если вы заставляете ширину: автоматически .. когда вы пытаетесь сделать то же самое с DIV или даже inline-block, то это работает ... для меня это довольно странно, но это то, что я нашел. – Luke

Попробуйте это:

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

источник

2013-04-05 18:27:20

Я размещаю материал с обеих сторон все время. Является ли это чем-то конкретным для текстовых полей, из-за чего они не хотят изменять размер в соответствии? – user1618143

@marcelo, что вы показываете в своем примере, означает, что ширина будет равна 100% + 50px, что приведет к тому, что элемент будет выходить за границы (так что это будет обрезано или появятся свитки, или это вызовет некоторые другие проблемы что я не могу вспомнить в данный момент). – trajce

Ops, немного неосторожность. Спасибо @trajce – 2013-04-05 18:39:00

Я получил его на работу с встроенным 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 Он работает как светлячок и хром

источник

2013-04-05 18:28:13

Разве это не то, что вы имеете в виду?

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

источник

2013-04-05 18:38:58

Используйте это на CSS:

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

HGS, Виниции =)

источник

2013-04-05 19:28:17

позиционирование div справа и слева одновременно

ответ

Смежные вопросы