2010-10-13 2 views
0

Я пытался найти это в stackoverflow, но не смог найти ответ.CSS Top Свойство, отличное от Internet Explorer и FireFox

Браузеров Я использую для тестирования: Firefox 3.6.8 Internet Explorer 6,029

Я создаю окно и позиционирование с помощью позиции: абсолютное и верхнего и левого свойства:

#testBox { 
    top:10px; 
    left:480px; 
    width:220px; 
    padding:3px; 
    position:absolute; 
    font-size:14px; 
    text-align:center; 
} 

<div> 
    <div> 
    <span style="position:relative;"> 
    <span id="testBox"> 
    testtesttesttesttest<br /> 
    </span> 
    </span> 
</div> 

То, что происходит, - это пробел «testBox» в IE, чем FireFox. Есть ли что-то, что я могу сделать, чтобы исправить эту проблему? Спасибо, Roy

+0

Живая скрипка: http://jsfiddle.net/tTcjS как ни странно, он отображает тот же эффект, что и в IE6 в Chrome 5. –

ответ

1

Ie6, будет проблема, в частности, 6 часть.

Вам, скорее всего, нужно будет определить разные правила в другой таблице стилей. Посмотрите в условные операторы: http://creativebits.org/webdev/ie_conditional_css

Также вы можете попробовать использовать сброс CSS, он будет делать вещи проще вниз линия: http://www.yahooapis.com/yui/3/cssreset/

+0

+1 за «определенно 6» – hookedonwinter

+0

@Pekka OP сказал неожиданное поведение существует в ie6, так что я предположил. Даже не думал, что проблема может быть в FF. Виноват. – hookedonwinter

+0

@hookedonwinter нет, в любом случае, я кажусь неправым: он похож на IE6 и Chrome, но не имеет места в IE8 и FF. Кажется, это проблема с пробелом. Это странно*! Я стою исправлено. –

0

Я не знаю, из не-хака метода, но вы можете использовать условный HTML (т. е. взломать), чтобы изменить верх в IE6. Поместите это после CSS, в HTML.

<!--[if lt IE 7]> 
    <style type="text/css"> 
      #testBox { 
       top: 20px; // or whatever 
      } 
    </style> 
<![endif]--> 
Смежные вопросы