Как устранить ошибку отображения

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем Novichok1991, 22 май 2016.

  1. Novichok1991

    Novichok1991

    Регистрация:
    22 май 2016
    Сообщения:
    3
    Симпатии:
    0
    Добрый день! Учусь верстать и вот такая вот проблема - сверстал три блока (у каждого свой цвет или картинка для заливки) и у двоих есть пунктирная рамка - в firefox отображается нормально
    а вот в 7 версии интернет експлорера плывет - пунктирная рамка почему то в промежутках между черточками использует цвет не блока в котором она прописана а цвет body.
    Кто то знает как устранить это недоразумение?
     
  2. $iD

    $iD Команда форума

    Регистрация:
    13 мар 2012
    Сообщения:
    3.349
    Симпатии:
    1.380
    1. нужно предоставить html, css
    2. забить на ie7? зачем вы его поддерживаете?
     
  3. Novichok1991

    Novichok1991

    Регистрация:
    22 май 2016
    Сообщения:
    3
    Симпатии:
    0
    HTML:
    <!DOCTYPE html>
    <html>
        <head>
           <title>page</title>
           <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
           <link href="css/index.css" rel="stylesheet">      
        </head>
        <body>
    <div id="footer">
                <div id="footer_upper">
                </div>
                <div id="footer_average">
                    <div id="footer_average_center">
                        <h3><span>RECENT POSTS</span></h3>
                        <ul>
                            <li><a href="#">TVGuide.com Watchlist Predicts Fall TV Shows’ Success</a></li>
                            <li><a href="#">7 Ways to Create a Memorable Customer Experience With Social Media</a></li>
                            <li><a href="#">Apple Gives Its Key Execs $400 Million in Bonuses</a></li>
                            <li><a href="#">How 5 Tech Giants Are Giving Back to Education</a></li>
                            <li><a href="#">Battlefield 3 Has Record Opening Weekend Despite Tech Woes</a></li>
                            <li><a href="#">The Evolving Role of Social Media in  News Organizations [LIVE Q&A]</a></li>
                        </ul>
                    </div>
                </div>
                <div id="footer_lower">
                    <div id="footer_lower_in">
                        <p class="p-right">Powered by<span> WordPress </span>- Designed &#38; Developed By<span> Mahdi El Hanafi</span></p>
                        <p class="p-left">Copyright &#169; 2011 <span>Ride Magazine</span> All Rights Reserved.</p>
                    </div>
                </div>
            </div>
        </body>
    </html>
    CSS:
    HTML:
    #footer_upper {
       margin: 0;
       height: 17px;
       min-width: 960px;
       background: green;
       border-bottom: 2px dashed red;
    }
    #footer_average {
       margin: 0 auto;
       background-image: url(../images/footer_average.jpg);
       background-repeat: repeat;
       min-width: 960px;
       max-width: 1200px;
       border-bottom: 2px dashed red;
       padding-bottom: 62px;
       overflow: hidden;
    }
    /*--footer_average_center--*/
    #footer_average_center {
       padding-top: 60px;
       margin: 0 auto;
       width: 252px;
    }
    #footer_average_center h3 {
       background: url(../images/footer_center_line_bg.png);
       background-repeat: repeat-x;
       background-position: 0 4px;
       width: 219px;
    }
    #footer_average_center h3 span {
       background: url(../images/footer_average.jpg);
       padding-left: 2px;
       padding-right: 14px;
    }
    #footer_average_center li a{
       padding-top: 17px;
       padding-bottom: 16px;
       color: #cccccc;
       display: block;
       border-bottom: 2px dashed red;
       text-decoration: none;
    }
    /*--footer_lower--*/
    #footer_lower {
       margin: 0 auto;
       background: green;
       min-width: 960px;
       overflow: hidden;
    }
    #footer_lower_in {
       margin: 0 auto;
       min-width: 960px;
       max-width: 1200px;
       overflow: hidden;
    }
    .p-right{
       float: right;
    }
    #footer_lower_in p {
       padding: 33px 10px 31px 10px;
    }
    #footer_lower_in span{
       font-size: 12.47px;
       color: #999999;
    }
    Поддерживаю ie7 так как он есть в средствах разработчика ie8. А его уже не надо поддерживать? ато я только учусь...
     
    Lasted edited by : 22 май 2016
  4. alex_storm

    alex_storm дизайн, CSS Команда форума

    Регистрация:
    11 дек 2012
    Сообщения:
    1.120
    Симпатии:
    559
    Официально уже и ie8 не поддерживается :Smile:
    Но некоторые компании требуют 8ку для поддержки
     
  5. Novichok1991

    Novichok1991

    Регистрация:
    22 май 2016
    Сообщения:
    3
    Симпатии:
    0
    хотелось бы все таки знать как устранить это конфликт - мало ли когда то придется столкнутся и тогда уже не отвертеться....!
     
  6. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    2.044
    Симпатии:
    774
    Любопытная логика.
    На сегодняшний день есть смысл поддерживать только ИЕ11 (ну и Edge).
    А причина в том, что в семёрке и выше ИЕ автоматом обновляется до 11 версии (ели пользователь вообще хоть иногда обновляет систему), а в XP он не может обновиться дальше восьмой версии, которая и на момент актуальности была не сильно пригодна для использования, а на текущий момент ею могут пользоваться разве что те, кто не пользуется Гуглом, который уже третий год, как прекратил поддержку ИЕ8 :Smile:

    И на последок: инструменты разработчика в ИЕ малость кривые и там поведения вёрстки в режимах разных версий ИЕ не соответствует тому, как она выглядит в реальности в этих версиях, проверено на собственном опыте.

    Не придётся никогда! А если кто-то попросит верстать под ИЕ7 - его можно посылать далеко и грубо :Smile:

    Это последствие особенности блочной модели старых ИЕ. Устраняется костылями. Например, подкладыванием под блок другого блока, большего размера с таким же фоном и конечно же, нужны отдельные стили, чтоб этот блок подложка был виден только в ИЕ.