Задать вопрос
@jgn333

Выравнивание меню CSS, откуда отступ?

Не могу нормально выровнять меню горизонтальное (ссылки по ширине). Вроде бы что-то начало получаться, но откуда лишний отступ слева, на скрине видно?

например:
<body>
    <header>
        <ul class="menuverh">
            <li><a href="index.html">Главная</a></li>
            <li><a href="history.html">История</a></li>
            <li><a href="bands.html">Группы</a></li>
			<li><a href="contacts.html">Контакты</a></li>
		<ul>
	</header>  
    <main>
        <aside>
        <ul>
            <li><a href="sound.html">Послушать</a></li>
            <li><a href="photoband.html">Фото исполнителей</a></li>
            <li><a href="photoconcert.html">Фото концертов</a></li>
            <li><a href="info.html">Дополнительная информация</a></li>
	    <li><a href="humor.html">Юмор</a></li>
        </ul>
		</aside>
        
		<span class="main-text">
            <p>
                <img alt="sludge music" class="sludgepic" src="im/02.jpg">
            </p>
            <h2>
              тексттексттексттексттексттекст
           </h2>
        </span>
    </main>


body{
    color:black;
    margin:0px;
    padding:0px;
	background-image:url(im/03.jpg);
}
header{
	position:fixed;
    top:0px;
    width:100%;
    height:50px;
    list-style:none;
    background-color:darkgreen;
}
/*-----------------------------------------------------------------------*/
header > ul > li >a{
    position:relative;
    width:290px;
    top:0px;
    color:#fff;
    font-size:15px;
    text-decoration:none;
    padding-left:13px;
    padding-right:13px;
    padding-top:8px;
    padding-bottom:8px;
	font-weight:bold;
}
header > ul > li{
    display:inline;
}
a:hover{
    opacity:0.5;
}
header > ul >li{
    display:inline;
    list-style:none;
    text-decoration:none;
}
.menuverh {
  text-align: justify;
  -moz-text-align-last: justify; text-align-last: justify;
}
.menuverh a {
  text-align: justify;
  -moz-text-align-last: justify; text-align-last: justify;
/*-----------------------------------------------------------------------*/
aside > ul > li{
    list-style:none;
    margin-left: -40px;
    margin-top:20px;
    margin-right:2px;
    }
aside > ul > li > a{
    color:black;
	font-weight:bold;
}
aside > ul{
    margin-top:6px;
    }
aside{
    float:left;
    width:30%;
    background-color:grey;
    margin-top:50px;
    margin-right:5px;
	text-align: center;
}
.main-text{
    display:block;
    padding-top: 50px;
    overflow: hidden;
}
h2 {
	text-align:  center;
}
span {
	padding-right: 5%;
	padding-left: 5%;
	padding-bottom: 5%;
}
.sludgepic {
	display:block;
	margin:0 auto;
}


9d46f6916ed48a5bdb4bda9e4dd67c28.png
  • Вопрос задан
  • 400 просмотров
Подписаться 1 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 1
bifot
@bifot
bifot.ru
Ну и меню конечно, а так во многих таких вопросах может помочь хтмлбук, а также гугл.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы