Поведение динамической страницы в IE

@AlexanderCh · Регистрация: 06.11.2016

Author24 — интернет-сервис помощи студентам

Здравствуйте!
Столкнулся с проблемой.
Вначале была создана обычная страница html с подключенной css. Исправно работало во всех браузерах.
Затем сделал динамическую страницу. В Мазиле и в Гугле отображается как и было задумано, в ЕХ же некоторые css команды не срабатывают:

CSS

1	border-radius 5px

не срабатывает ни в одной рамке, при том border-top,left,right,bottom срабатывают

Не срабатывают css привязанные к строке поиска, при этом же срабатывает css привязанный к кнопке поиска

Еще проблема возникает

CSS

1	padding-top

Везде кроме ЕХ за счёт div делается отступ,, если добавляю значение padding-top , то в ЕХ выравнивается, а в остальных опускается еще ниже.
Не знаю как решить эти проблемы.

Что можно сделать?

@mrtoxas · 06.11.2016, 22:46

Попробуйте в первую очередь подключить normalize.css, а потом уже все остальные стили.

@AlexanderCh · 08.11.2016, 15:34 **[ТС]**

Спасибо!

Проблема не решилась.

Что еще можно сделать?

@mrtoxas · 08.11.2016, 15:39

Открываете инструменты разработчика и смотрите какие стили перебивают ваши. Для дальнейшего разбирательства надо больше кода. Есть возможность показать проблемную страницу - архивом, ссылкой? Или приведите код, который поможет воспроизвести проблему.

@AlexanderCh · 11.11.2016, 18:49 **[ТС]**

CSS

body {
    display: inline;
    font-size: 100%;
}
div#block {
    width: 1046px;
    height: 40px;
    margin: 0 auto;
}
div.head {
    width: 1042px;
    height: 25px;
    margin-top: -19px;
    border: 1px solid #3f4ae7;
    border-radius: 3px;
    background-color: #3f4ae7;
    text-indent: 25px;
    color: #ffffff;
    font-family: Times, serif;
}
div.headempty {
    width: 1046px;
    height: 5px;
    clear: both;
    margin: 0 0;
    padding: 0 0;
}
div.leftcol{
    width: 130px;
    height: 370px;
    float: left;
    margin-top: -900px;
    border-top: 3px solid #3f4ae7;
    border-left: 3px solid #3f4ae7;
    border-right: 3px solid #3f4ae7;
    border-bottom: 3px solid #3f4ae7;
    border-radius: 5px;
}
div.centemptlef {
    width: 2px;
    height: 550px;
    float: left;
}
div.centercol {
    width: 700px;
    height: 65px;
    float: left;
    margin-top: 15px;
    padding-left: -2px;
    border-left: 2px solid #3f4ae7;
    border-top: 2px solid #3f4ae7;
    border-right: 2px solid #3f4ae7;
    border-bottom: 1px solid #3f4ae7;
    border-radius: 5px 5px 5px 5px;
}
div.centerempbot {
    width: 700px;
    height: 2px;
}
div.centercoll {
    width: 700px;
    height: 400px;
    float: left;
    margin-top: -280px;
    padding-left: -2px;
    border-left: 2px solid #3f4ae7;
    border-top: 2px solid #3f4ae7;
    border-right: 2px solid #3f4ae7;
    border-bottom: 1px solid #3f4ae7;
    border-radius: 5px 5px 5px 5px;
}
div.centemptrig {
    width: 2px;
    height: 550px;
    float: left;
}
div.rightcol {
    width: 200px;
    height: 352px;
    float: left;
    margin-top: 15px;
    margin-left: 2px;
    padding-left: -2px;
    border-left: 1px solid #3f4ae7;
    border-top: 1px solid #3f4ae7;
    border-right: 1px solid #3f4ae7;
    border-bottom: 1px solid #3f4ae7;
    border-radius: 5px;
}
div.rightsempty {
    width: 204px;
    height: 2px;
    float: left;
}
div.rightcolll {
    width: 200px;
    height: 243px;
    float: left;
    margin-top: 2px;
    margin-left: 2px;
    padding-left: -2px;
    border-left: 1px solid #3f4ae7;
    border-top: 1px solid #3f4ae7;
    border-right: 1px solid #3f4ae7;
    border-bottom: 1px solid #3f4ae7;
    border-radius: 5px;
}
div.footer {
    width: 1046px;
    height: 40px;
    float: left;
    margin-top: 2px;
    border: 1px solid #3f4ae7;
    border-radius: 5px;
}
div[class="leftcol"], div[class="centercol"], div[class="rightcol"] {
    margin-top: -20px;
    background-color: #ffffff;
    color: #0000a6;
}
ul li {
    display: inline;
    width: 1046px;
    padding-right: 20px;
    list-style-type: none;
    text-decoration: none;
    height:20px;
}
input[type="search"] {
    line-height: 25px;
    width: 300px;
    padding-left: 2px;
    border: 1px solid #0000a6;
    border-radius: 3px 0px 0px 3px;
    font-size: 150%;
    overflow: hidden;
}
input[type="submit"] {
    line-height: 25px;
    width: 60px;
    position: absolute;
    background-color: #0000a6;
    color: #ffffff;
    border: 1px solid #0000a6;
    border-radius: 0px 3px 3px 0px;
    font-family: Times, serif;
    cursor: pointer;
}
ul.head {
    
}
a {
    list-style-type: none;
    text-decoration: none;
    font-size: 15px;
    color: #0000a6;
}
img {
    height: 150px;
    width: 150px;
    margin-left: 15px;
    margin-bottom: 15px;
    float: left;
    border: 1px solid #000000;
}
br {
    margin-top: 5px;
}
a.color {
    color: #ffffff;
}
p {
    text-align: center;
}

@mrtoxas · 11.11.2016, 18:59

AlexanderCh, Еще разметку приложите и расскажите у каких блоков проблемы со стилями. И что такое ЕХ?

@AlexanderCh · 11.11.2016, 19:09 **[ТС]**

Получается сделал динамическую страницу :

PHP

<?php
    require "header.php";
    require "underheader.php";
    require "leftcol.php";
    require "centercol.php";
    require "rightcol.php";
    $centercoll = "Привет!!!!";
    require "centercoll.php";
    require "rightcoll.php";
    require "beforefooter.php";
    require "footer.php";
?>

Добавлено через 3 минуты
При статике никаких проблем нет. При динамике нарезал части страниц и подключил к одному файлу. При вышеуказанной форме в Internet Explorer ни один border-radius не срабатывает, строка поиска выравнивается с верхней границей

Добавлено через 1 минуту
Пример centercol.php

PHP

<div class="centercol"> 
    <form> <p> <input type="search" /> <input type="submit" value="Поиск" /> </p> 
    </form>
</div>
<div class="div.centemptrig"> </div>

@mrtoxas · 11.11.2016, 19:15

HTML5

1	<div class="div.centemptrig"></div>

Исходя из стилей, класс у этого блока должен быть таким

HTML5

1	<div class="centemptrig"></div>

Проверьте код, может там еще такое встречается.

@AlexanderCh · 11.11.2016, 19:41 **[ТС]**

Спасибо, такое еще было в одном месте. Это пустоты.

Сама проблема так и не решилась.

В вышеприведенном примере - <р></р> не срабатывают при динамической странице и стили по круглым углам , по строке поиска также не срабатывают

@mrtoxas 3825 / 2675 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	06.11.2016, 22:46	2
	Попробуйте в первую очередь подключить normalize.css, а потом уже все остальные стили. 0

@AlexanderCh 0 / 0 / 0 Регистрация: 06.11.2016 Сообщений: 11
	08.11.2016, 15:34 [ТС]	3
	Спасибо! Проблема не решилась. Что еще можно сделать? 0

@mrtoxas 3825 / 2675 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	08.11.2016, 15:39	4
	Открываете инструменты разработчика и смотрите какие стили перебивают ваши. Для дальнейшего разбирательства надо больше кода. Есть возможность показать проблемную страницу - архивом, ссылкой? Или приведите код, который поможет воспроизвести проблему. 0

@mrtoxas 3825 / 2675 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	11.11.2016, 18:59	6
	AlexanderCh, Еще разметку приложите и расскажите у каких блоков проблемы со стилями. И что такое ЕХ? 0

@AlexanderCh 0 / 0 / 0 Регистрация: 06.11.2016 Сообщений: 11
	11.11.2016, 19:41 [ТС]	9
	Спасибо, такое еще было в одном месте. Это пустоты. Сама проблема так и не решилась. В вышеприведенном примере - <р></р> не срабатывают при динамической странице и стили по круглым углам , по строке поиска также не срабатывают 0