Меню поднимает блок вверх

20.04.2014, 04:16. **Показов** 2983. **Ответов** 2

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

Учусь верстать html+css и вот столкнулся с проблемой:

HTML5

<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
</head>
<body>    
        <div id="all">
            <div id="header">1</div>
            <div id="menu" class="block-inline">
                    1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111<br />
                    1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111<br />
                    1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111<br />
                    
 
            </div>
            <div id="content" class="block-inline">3</div>  
            <div id="new" class="block-inline">4</div>
            <div id="footer">5</div>
        </div>
        
</body>
</html>

CSS

body{
    background-image: url("../img/body2.jpg");
    background-size: 100%;
}
#all{
    width: 1000px;
    background-color: black;
    margin: 0 auto;
    
}
 
#header {
    width: 100%;
    height: 100px;
    background-image: url("../img/header.png");
}
.block-inline {
    display: inline-block;
    margin: 0;
    padding: 0;
}
 
#menu{
    background-color: #075;
    width: 200px;
    height: 500px;
}
 
#content{
    background-color: blue;
        width: 590px;
            height: 500px;
}
 
#new{
        background-color: blue;
        width: 200px;
            height: 500px;
}
 
#footer{
    width: 100%;
    height: 100px;
}

Проблема с блоком меню - как только туда вставляю меню оно поднимает весь блок вверх. прошу подсказать что не так или как правильно если есть ошибки.

@Vladislav WebDev · 20.04.2014, 08:53

azgardia, попробуйте так

CSS

.block-inline {
    float: left;
    margin: 0;
    padding: 0;
}

@VitoAcidrain · 20.04.2014, 09:24

Сообщение от azgardia

Учусь верстать html+css

Типовые макеты.
Полезный сайт для верстальщика.

Добавлено через 10 минут

Сообщение от Suby

попробуйте так

Это пустое. Исправит одно, но сломает другое.
Здесь нужно ещё каждому блоку свойство display прописать.

@VitoAcidrain 59 / 59 / 7 Регистрация: 11.03.2013 Сообщений: 191
	20.04.2014, 09:24	3
	Сообщение от azgardia Учусь верстать html+css Типовые макеты. Полезный сайт для верстальщика. Добавлено через 10 минут Сообщение от Suby попробуйте так Это пустое. Исправит одно, но сломает другое. Здесь нужно ещё каждому блоку свойство display прописать. 0