Как иметь как горизонтальный, так и вертикальный навигационный планку ⇐ CSS

[Anonymous]

Как я могу сделать так, чтобы я мог иметь как горизонтальную, так и вертикальную навигационную панель? Я большой новичок в дизайне, и я пытаюсь выяснить, что делаю не так, но я не уверен, как иметь CSS по нескольким ссылкам. < /P>

Код: Выделить всё

[list]
[*] link1
[*]link 2
[*]link 3
[*]


css: < /p>

.horizontallinks {
position: fixed;
list-style-type: none;
margin-top: 70px;
margin-left: 300px;
padding: 0;
font-size: 18px;
overflow: hidden;
background-color: white;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

.verticallinks {
position: fixed;
list-style-type: none;
padding: 0;
font-size: 18px;
margin-left: 45px;
margin-top: 165px;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

li {
float: left;
}

li a {
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
< /code>


.horizontallinks {
position: fixed;
list-style-type: none;
margin-top: 70px;
margin-left: 300px;
padding: 0;
font-size: 18px;
overflow: hidden;
background-color: white;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.verticallinks {
position: fixed;
list-style-type: none;
padding: 0;
font-size: 18px;
margin-left: 45px;
margin-top: 165px;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li {
float: left;
}
li a {
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}< /code>


[list]
[*]link1
[*]link 2
[*]link 3
[*]link 4
[/list]

[list]
[*]link a
[*]link b
[*]link c
[/list]

Подробнее здесь: https://stackoverflow.com/questions/343 ... gation-bar