Css на IE7 сНу позиции некорректной

Question

Пожалуйста, смотрите картинку выше. Я стараюсь, чтобы [div1] находился в нижней части [div2] в IE7 . но сбой. Пожалуйста, помогите мне. Пожалуйста, смотрите изображение выше. Я стараюсь, чтобы [div1] находился в нижней части [div2] в IE7 . но сбой. Пожалуйста, помогите мне. Пожалуйста, смотрите изображение выше. Я стараюсь, чтобы [div1] находился в нижней части [div2] в IE7 . но сбой. Пожалуйста, помогите мне.

<div style="margin-bottom: 10px;overflow: hidden;font-size:12px;"> 
    <div style="float:left"> 
     <img style="width: 30px;height: 30px;border-radius: 100%;vertical-align: middle;" src="http://cdn.5u55.cn/face/u0.jpg"> 
     <div style="margin-top:2px;font-size:9px;">name1</div> 
    </div> 
    <strong style="float: left; border-style: solid; border-width: 10px; border-color: #fff #d4edf4 #fff #fff; height: 0; font-size: 0; width: 0;margin-top:7px;"></strong> 
    <div> 
    <div style="float:left;display: inline-block;background-color: #d4edf4;position: relative;padding: 10px;line-height: 18px;border-radius: 4px;color: #333;"> 
     test test test test test test 
    </div> 
    <br clear="all" /> 
    <div style="float:left;margin-left:60px;color: #ccc;font-size:9px;">2016-02-17 22:21:00</div> 
</div> 
<br clear="all" /> 
<br clear="all" /> 
<div style="margin-bottom: 10px;overflow: hidden;font-size:12px;"> 
    <div style="float:right;display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;flex-direction: row;-webkit-box-pack: end;justify-content: flex-end;padding: 5px;"> 
     <img style="width: 30px;height: 30px;border-radius: 100%;vertical-align: middle;" alt="" src="http://cdn.5u55.cn/face/u0.jpg"> 
     <div style="margin-top:2px;font-size:9px;">name2</div> 
    </div> 
    <strong style="float: right; border-style: solid; border-width: 10px; border-color: #fff #fff #fff #f1ddde ; height: 0; font-size: 0; width: 0;margin-top:10px;margin-left:-1px;"></strong> 
    <div style="float:right;background-color: #f1ddde;position: relative;padding: 10px;line-height: 18px;margin-left:42px;color: #333;"> 
     dadasd 
    </div> 
    <br clear="all" /> 
    <div style="float:right;color: #ccc;font-size:9px;margin-right:58px;">2016-02-17 22:21:00</div> 
</div> 
<br clear="all" /> 
<br clear="all" /> 
<div style="text-align: center;width: 100%;margin: 5px auto;font-size: 10px;margin:0 20px 10px;"> 
    <p style="color:red;background-color: lightGrey;padding: 5px 10px;border-radius: 5px;">thanks</p> 
</div> 
</html> 

Answer 1

IE 10 и ниже мертв, IE база пользователей является слишком низким (2015 December 6,3%) и IE 10 and below is only 1,4%. Вы должны прекратить проверку кода для людей с каменным возрастом. Кстати, использование встроенного CSS не является хорошей практикой, и вам следует избегать этого.

Answer 2

Самый простой способ решить проблему является, чтобы сделать CSS для IE только сделать новую таблицу стилей и ссылку на него, как этот

<!--[if IE]> 
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" /> 
<![endif]--> 

Теперь у вас есть ванная таблицы стилей, которые только будут иметь влияние на IE браузеров

Но, как сказано выше. ниже IE 10 мертв, не стиль для этого. И избегайте встроенного стиля. для вашего же блага.