border - HTML, CSS - Ответ 4585691

@vanyakilkil · Регистрация: 13.06.2012

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

Имеется сайт. Если убрать border то все содержимое, которое находится ниже блока уходит вниз. Непойму как так. border находится в шапке сайта, но ведь он не должен менять содержимое, это просто граница...
Вот код без border в блоке shapka:

CSS

body {
margin: 0;
min-width: 900px;
max-width: 1900px;
background-color: #336699;
}
 
#shapka {
width: 100%;
height: 186px;
border: 1px solid red;
}
 
#menu_kontekst {
margin-top: 10px;
float: left;
width: 184px;
height: 274px;
list-style: none;
}
 
#inf {
margin: 10px 220px 0 194px;
height: 1000px;
border: 1px solid yellow;
}
 
#piar {
margin-top: 10px;
float: right;
width: 210px;
height: 500px;
border: 1px solid black
}
 
#menu {
margin-top: 135px;
height: 50px;
list-style: none;
}
 
#menu div {
min-width: 710px;
max-width: 1154px;
margin: 0 auto;
text-align: center;
list-style: none;
}
 
#menu ul  {
margin-top: 0;
display: inline-block;
}
 
#menu ul li {
width: 84px;
height: 50px;
background:#fff;
float: left;
list-style: none;
border-right: 1px solid #336699;
margin: 0;
padding: 0;
background-image: url("Ссылка_(обычная).jpg");
}
 
#menu ul li a {
padding: 15px 0;
margin: 0;
width: 84px;
display: block;
text-decoration: none;
}
 
#menu ul li a:hover {
background-image: url("Ссылка_(навести).jpg");
color: #fff;
display: block;
}
 
#menu_kontekst div {
min-width: 84px;
max-width: 184px;
margin: 0 auto;
text-align: center; 
list-style: none;
}
 
#menu_kontekst ul {
margin-top: 0;
padding: 0;
display: block;
}
 
#menu_kontekst ul li {
height: 26px;
width: 100%;
background-image: url("контекст.jpg");
list-style: none;
border-bottom: 1px solid black;
margin: 0;
}
#menu_kontekst ul li a {
padding: 3px 0;
margin: 0;
display: block;
text-decoration: none;
}
 
#menu_kontekst ul li a:hover {
background-image: url("активная.jpg");
color: #333333;
display: block;
}

HTML5

<!DOCTYPE html>
<html>
<head>
<title>Главная</title>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
 
    <div id="shapka">
        <div id="menu">
            <div>
            <ul>
            <li><a href="index.html">Главная</a></li>
            <li><a href="javascript:DoIt();">бла бла</a></li>
            <li><a href="javascript:DoIt();">бла бла</a></li>
            <li><a href="javascript:DoIt();">бла бла</a></li>
            <li><a href="javascript:DoIt();">бла бла</a></li>
            <li><a href="javascript:DoIt();">бла бла</a></li>
            <li><a href="javascript:DoIt();">бла бла</a></li>
            <li><a href="javascript:DoIt();">О сайте</a></li>
            <li><a href="javascript:DoIt();">Контакты</a></li>
            </ul>
            
            </div>
        
        </div>
        
    </div>
    
    <div id="menu_kontekst">
        <div>
        <ul>
            <li><a href="javascript:DoIt();">здесь был бы раздел 1</a></li>
            <li><a href="javascript:DoIt();">а здесь был бы раздел 2</a></li>
            <li><a href="javascript:DoIt();">а здесь был бы раздел 3</a></li>
        </ul>
        </div>
    </div>
    
    <div id="piar">
    
    </div>
 
    <div id="inf">
    
    </div>
 
 
 
</body>
</html>

Вернуться к обсуждению:
border HTML, CSS

Следующий ответ

Другие темы раздела
HTML, CSS блок с прокруткой https://www.cyberforum.ru/ html/ thread871717.html Здраствуйте, хотел бы спросить кто как делает блок с прокруткой .SimpleDiv { width:50px; height:50px; background: #fff; border: 1px solid #C9CFD3; overflow:auto; } вот пример но он неочень подходит т.к. у него полоса прокрутки есть, хотелось бы увидеть без полосы прокрутки и чтобы как слайд прокручивал изображение	HTML, CSS Массовый перенос style из HTML в CSS Есть HTML документ, в котором очень много разнообразных стилей. Например <span style="font-family: Arial, Helvetica, sans; font-size: 12px; line-height: 14px; text-align: justify; -webkit-border-horizontal-spacing: 10px; -webkit-border-vertical-spacing: 5px;"></span> Существует ли какой-нибудь софт, или лёгкое решение этой проблемы: Нужно пройтись по каждой строке и перенести все стили в css...
HTML, CSS как сделать отступы между тегом li как сделать отступы между тегом li. Желательно с примерчиком. https://www.cyberforum.ru/ html/ thread871608.html	HTML, CSS Как перенести дизайн сайта в html на CMS? https://www.cyberforum.ru/ html/ thread871545.html Дали вот такое странное задание. Дали ссылку на сайт (просто дизайн с кодом, со слайдшоу и т.д., ссылки никуда не ведут) Задание дословно: перенести дизайн сайта в html на CMS Amiro и сохранить результат. Вот давно уже верстаю и с CMS работаю а тут даже не знаю с какой стороны подойти. Что надо сделать?
Настройка выдвижного меню на ucoz HTML, CSS Есть код горизонтального меню <div class="menu"> <ul id="menu"> <li><a href="/">Главная</a></li> <li><a href="/">111</a></li> <li><a href="/">ольршь</a></li> <li><a href="/">нтпноьл</a></li> </ul> </div>	HTML, CSS Не могу разобраться с CSS https://www.cyberforum.ru/ html/ thread871201.html Добрый день форумчане! Помогите с CSS. Плагин вывода содержания в посте Н2, Н3. При выводе содержания в начале поста, оно съезжает (залезает на картинку, если задана МИНИАТЮРА в посте) Плагин под WP, судя по всему рукописный... Содержание выводится через li, соответственно. Как переназначить li, а то в середине поста все списки тоже съезжают? Сбрасываю сам плагин, и файлы reset.css в...
HTML, CSS Как сдвинуть меню ниже, чтобы было больше места под логотип? https://www.cyberforum.ru/ html/ thread871145.html Уважаемые форумчане выручайте))не получается подвинуть меню вниз,хочется добавить логотип,и нужно больше места выше меню)надо все плавно сдвинуть)Заранее спасибо) http://allworld.pusku.com/ сайт работает на Вордпрессе	HTML, CSS Ссылка должна подсвечиваться при наведении на картинку Ссылка должна подсвечиваться при наведении на картинку. А она подсвечивается только тогда, когда я навожу на нее сверху. И текст наверху, не могу его опустить вниз ничем, чтобы не зацепить блок.... Вот сам код: body { margin: 0px; min-width: 900px; max-width: 1900px; background-color: #336699; } #shapka {
HTML, CSS transform 3D в Chrome https://www.cyberforum.ru/ html/ thread871045.html Добр. день. У меня на кануне появилась проблема связанная именно с браузером Chrome. Использую пример создания 3D куба на css ( Поскольку я не силен в 3D ) я создал 3D куб. На одной из сторон куба находилась форма для заполнения. В mozil-е все ok работает. Но вот в chrome переместить фокус на поле input через клик не получается, такое впечатления что сверху формы есть слой на который и...	HTML, CSS тест с ошибкой https://www.cyberforum.ru/ html/ thread871011.html Создал простой тест на html, но почему то не считает ответы, кто может сказать почему и в чем я сделал ошибку? <html><head><title>ТЕСТ</title> </head><body background="tz15.jpg"><h1>Тест</h1> <p><strong>ДАННЫЙ ТЕСТ СОСТОИТ ИЗ 40 ВОПРОСОВ ДЛЯ ПРОВЕРКИ ЗНАНИЙ ПО ПРОЙДЕНОМУ МАТЕРИАЛУ</strong></p> <p>1.Вопрос<br> <input type=radio name=q1 onClick="b1=0"> ответ1<br>
HTML, CSS Выравнивание div внутри ячейки таблицы Здравствуйте. Никак не получается выравнивать div внутри ячейки таблицы. Способы, которые описаны в интернетах, вроде margin: 0 auto не помогают. Суть в том, что див, вместо того, чтобы растянуться внутри ячейки на все доступное расстояние в ширину, почему-то растягивается еще придачу на ~ 14 пикселей и тем самым нарушает дизайн страницы. Вот черновая верстка и CSS: <td id="right-colomn"> ...	HTML, CSS css блок div как сделать эффект hover для блока div,чтобы при наведении курсора на блок,менялся цвет фона? https://www.cyberforum.ru/ html/ thread870864.html

	20.05.2013, 15:56