1

index.html:

<!DOCTYPE>
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Lobster&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Сайт находится в разработке.</title>

<link rel="stylesheet" type="text/css" href="style.css"/>

</head>

<body>
    <div id="stripe">
        <div id="logo" >bla<img src="img/reddot.png"/>bla</div>
    </div>
    <div id="construct">
        <p>Сайт находится в разработке.</p>
    </div>

</body>
</html>

css:

/* CSS Document */
*{margin:0;padding:0;}
html {
        background: url(img/back_gray.jpg) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}

body{
    overflow:hidden;
}


p{
    font-family: 'Lobster', 'cursive';
    color:#000;
    font-size:1.8em;
    text-shadow:1px 1px 1px #fff;

}
#stripe{
    position:relative;
    top:50%;
    margin-top:-25px;
    width:100%;
    height:50px;
    background-color:black;

}
#logo{
    height:40px;
    width:140px;
    position:relative;
    left:50%;
    margin-left:-70px;  
    font-size:2.5em;
    color:#fff;
    font-family:"MS Serif", "New York", serif;  
    text-align:center;  
}
#logo img{
    height:7px;
    width:7px;
    margin-bottom:4px;
    padding:2px;    
}
#construct{
    height:100px;
    width:100%;
    position:relative;
    top:50%;
    text-align:center;
}

Проблема в том ,что в Опере и Фоксе средняя полоса и текст не используют позиционирование, висят в самом верху страницы, ловя только margin.

скриншоты:

Глюк Оперы и Фокса

Как должно быть и как есть в webkit

Вопрос: что с этим делать, как подогнать верстку под все браузеры? "Хочу чтобы всё было как на втором фото"

1 ответ 1

2

http://jsfiddle.net/Ab4V9/

1
  • Спасибо за ответ! Прекрасно работает, но не могли бы Вы пояснить почему именно так? Насколько я заметил Вы поменяли position:relative на absolute , плюс выставили overflow на body; Почему именно так? В чём я ошибся поставив relative?
    – zanshin13
    27 апр 2014 в 13:35

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.