Метод JQuery .before () или .insertBefore () в IE7 - PullRequest
Новая
       14

Метод JQuery .before () или .insertBefore () в IE7

3 голосов
/ 09 ноября 2011

Я пытаюсь вставить цветной div перед флажком, используя .before() метод jQuery 1.5.1, который хорошо работает на FF, Chrome, IE8 +; но для IE7 вставленный цвет div не находится на той же строке, что и флажок. Я хотел бы, чтобы кто-нибудь мог дать мне любой совет. Благодарю. прикрепленные коды: 

<!DOCTYPE HTML>
<html>
    <head>
    </head>
    <body>
        <input type="checkbox" id="check1" />PINK
        <script type="text/javascript">
        var colorHtml = '<div style="border: 1px solid rgb(204, 204, 204); display: inline-block;   margin-left: 20px; width: 12px;"><div style="width: 4px; height: 0pt; border: 4px solid rgb(200,100,200); overflow: hidden;"></div></div>';
        $("#check1").before(colorHtml);
        </script>
    </body>
</html>

снимок экрана:

IE7: IE7

IE8: IE8

ОБНОВЛЕНИЕ:

добавление числа с плавающей запятой: слева: enter image description here

не использует float, добавление «zoom: 1; * display: inline;»: enter image description here

Ответы [ 3 ]

3 голосов
/ 09 ноября 2011

Вы можете получить их в одной строке, добавив float:left; к стилю вашего внешнего divH colorHtml: 

<div style="float: left; border: 1px solid rgb(204, 204, 204); display: inline-block;   margin-left: 20px; width: 12px;"><div style="width: 4px; height: 0pt; border: 4px solid rgb(200,100,200); overflow: hidden;"></div></div>

Вот jsfiddle: http://jsfiddle.net/G4sY4/2/

1 голос
/ 09 ноября 2011

Проблема с настройкой стиля inline-block.IE7 на самом деле не делает это правильно.Попробуйте переместить его влево внутри контейнера и не устанавливайте inline-block.

Обновление : описание проблемы и альтернативный способ ее решения можно найти по адресу: http://flipc.blogspot.com/2009/02/damn-ie7-and-inline-block.html

Сводка: добавьте "zoom: 1; * display: inline;"

1 голос
/ 09 ноября 2011

изменить отображение: встроенный блок на встроенный, что должно решить проблему. Тип отображения блока вызывает разрыв строки после тега

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...