Интервал между логотипом и навигационной панелью

-1

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

Прямо сейчас это выглядит следующим образом:

Но я не хочу пространство между ними:

Пожалуйста, помогите мне, вот мой код:

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>MENU BAR</title> 
 
<link href='http://fonts.googleapis.com/css?family=Francois+One' rel='stylesheet' type='text/css'> 
 
<link href='http://fonts.googleapis.com/css?family=Days+One' rel='stylesheet' type='text/css'> 
 
<style type="text/css"> 
 
*{ 
 
\t margin-bottom: 0px; 
 
\t margin-left: 0px; 
 
\t margin-right: 0px; 
 
\t margin-top: 0px; 
 
\t padding-bottom: 0px; 
 
\t padding-left: 0px; 
 
\t padding-right: 0px; 
 
\t padding-top: 0px; 
 
\t } 
 
body{ 
 
\t background:url(future.jpg); 
 
\t position:center; 
 
\t height:100%; 
 
\t width:100%; 
 
\t } 
 
#container{ 
 
\t margin-top: 105px; 
 
\t margin-left: 300px; 
 
\t height: 50px; 
 
\t } 
 
.menu{ 
 
\t list-style:none; 
 
\t } 
 
.menu li{ 
 
\t position:center; 
 
\t float: left; 
 
\t background: rbackground: #ffffff; /* Old browsers */ 
 
\t background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* FF3.6+ */ 
 
\t background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6)); /* Chrome,Safari4+ */ 
 
\t background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Chrome10+,Safari5.1+ */ 
 
\t background: -o-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Opera 11.10+ */ 
 
\t background: -ms-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* IE10+ */ 
 
\t background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* W3C */ 
 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0); /* IE6-9 */ 
 
\t font-family: 'Francois One', sans-serif; 
 
\t text-align: center; 
 
\t display: block; 
 
\t height: 50px; 
 
\t width: 150px; 
 
\t line-height: 50px; 
 
\t border-right: 1px solid rgba(51,51,51,1); 
 
\t -webkit-transition: all .3s linear 0s; 
 
\t -moz-transition: all .3s linear 0s; 
 
\t -ms-transition: all .3s linear 0s; 
 
\t -o-transition: all .3s linear 0s; 
 
\t transition: all .3s linear 0s; 
 
\t } 
 
.left{ 
 
\t border-top-left-radius:50px; 
 
\t border-bottom-left-radius:50px; 
 
\t } 
 
.right{ 
 
\t border-top-right-radius:50px; 
 
\t border-bottom-right-radius:50px; 
 
\t border:0px; 
 
\t } 
 
.menu li:hover{ 
 
\t background:background: #ffffff; /* Old browsers */ 
 
\t background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */ 
 
\t background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */ 
 
\t background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */ 
 
\t background: -o-radial-gradient(center, ellipse cover, #ffffff 0%,#e5e5e5 100%); /* Opera 12+ */ 
 
\t background: -ms-radial-gradient(center, ellipse cover, #ffffff 0%,#e5e5e5 100%); /* IE10+ */ 
 
\t background: radial-gradient(ellipse at center, #ffffff 0%,#e5e5e5 100%); /* W3C */ 
 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=1); /* IE6-9 fallback on horizontal gradient */ 
 
    color:rgba(0,0,51,1); \t \t 
 
} 
 
h1{ 
 
\t color: white; 
 
\t font-family: 'Days One', sans-serif; 
 
\t position: center; 
 
\t font-size: 50px; 
 
\t -webkit-text-stroke-width: 1px; 
 
    -webkit-text-stroke-color: black; 
 
    text-align: center; 
 
\t } 
 
</style> 
 
</head> 
 
<body onResize="resize();"> 
 
<h1>DRAGONSHOP.LT</h1> 
 
<div id="container"> 
 
<ul class="menu"> 
 
<li class="left">PRADŽIA</li> 
 
<li>APIE MUS</li> 
 
<li>KAIP UŽSISAKYTI</li> 
 
<li>PRISTATYMAS</li> 
 
<li class="right">KONTAKTAI</li> 
 
</ul> 
 
</div> 
 
</body> 
 
</html> 
 
<link rel="stylesheet" type="text/css" href="styles.css"> 
 
</head> 
 
<html> 
 
<head>

источник

2015-08-16 BananaFlow

Заменить #container идентификатор с этим:

#container 
    { 
    margin-top: 105px; 
    margin-left: 300px; 
    height: 50px; 
    position: relative; 
    bottom: 90px; 
    }

источник

2015-08-16 09:34:58 user5173426

Спасибо, это сработало! – BananaFlow

@BananaFlow Примите мой ответ, если он сработает для вас :) – user5173426

Это потому, что вы установили top margin в 105px

попробовать это

#container{ 
    margin-top: 11px; 
    margin-left: 300px; 
    height: 50px; 
}

не забудьте посетить my site

источник

2015-08-16 10:22:35 mim

Интервал между логотипом и навигационной панелью

ответ

Смежные вопросы