Я хотел бы попросить вашу помощь с моей нижней навигационной панелью и ссылкой на обеих навигационных барах.Фиксация нижней навигационной панели + фиксирующая ссылка на другую веб-страницу
Я не могу показаться, что он появился в центре. Будет ли использовать прокладку, чтобы исправить это? Я пытался его использовать, но мне нужно оценить количество пикселей.
Моя вторая проблема в том, что моя нижняя панель навигации не имеет правильного интервала. Я уже изменил размер шрифта, но это не устраняет проблему. Прямо сейчас, это выглядит так: «HomeWho We AreWhat We Do ...».
Моя третья проблема заключается в том, что одна из моих ссылок не работает. Это ссылка на другую веб-страницу, которую я закодировал. Я думаю, что набрал его правильно, но это не сработает.
Вот скрипку: https://jsfiddle.net/captainpokey/66szogpm/
А вот код:
html {
\t 100%
}
body {
\t background: #cecdcc;
\t margin: 0;
\t padding: 0;
\t color: #8c8b8a;
\t font-size: 18px;
\t font-family: "Lato", sans-serif;
}
#wrap {
\t background-color: #fff;
\t width: 1000px;
\t margin: 0 auto;
}
#nav {
\t width: 1000px;
\t height: 45px;
\t background: #dcdbda;
\t font-family: "Lato";
\t font-size: 18px;
}
#nav ul {
\t padding: 0;
\t margin: 0;
\t background: #dcdbda;
\t float: left;
\t margin-left: 50px; \t
}
\t
#nav li {
\t height: 40px;
\t padding-top: 4px;
\t float: left;
\t position: relative;
\t width: 150px;
\t list-style: none;
}
\t
#nav a {
\t display: block;
\t text-decoration: none;
\t text-align: center;
\t color: #949392;
}
#nav ul ul {
\t position: absolute;
\t left: 0;
\t top: 100%;
\t visibility: hidden;
\t margin: 0;
\t padding: 0;
}
\t \t
#nav li:hover, #nav li:hover li {
\t background: #fff;
}
#nav li li:hover, #nav li li:hover li {
\t background: #bbb;
}
\t
#nav li:hover ul {
\t visibility: visible;
}
#header {
\t width: 1000px;
\t height: 485px;
\t background-image: url(../images/headerphoto.jpg);
}
#content {
\t background-color: #fff;
\t font-family: "Lato", sans-serif;
\t color: #777674;
\t padding-top: 10px;
\t padding-bottom: 20px;
}
#content h4 {
\t padding-left: 150px;
\t padding-right: 150px;
\t font-family: "Lato", sans-serif;
\t font-size: 20px;
\t text-transform: bold;
}
#content p {
\t padding-left: 150px;
\t padding-right: 150px;
\t font-family: "Lato", sans-serif;
\t font-size: 18px;
\t text-transform: bold;
}
#footer {
\t background-image: url(../images/footerphoto.jpg);
\t width: 1000px;
\t height: 255px;
}
#navbottom {
\t padding-left: 130px;
\t width: 1000px;
\t color: #fff;
\t font-size: 12px;
\t font-family: "Lato";
}
#navbottom ul {
\t padding: 0;
\t margin: 0;
\t float: left;
\t margin-left: 20px;
\t margin-right: 20px;
}
#navbottom ul li {
\t float: left;
\t position: relative;
\t list-style-type: none;
}
#navbottom li:hover ul {
\t visibility: visible;
}
#navbottom a {
\t display: block;
\t text-decoration: none;
\t text-align: center;
\t color: #fff;
}
#copyright {
\t padding-left: 150px;
\t padding-right: 150px;
\t font-family: "Lato", sans-serif;
\t font-size: 16px;
}
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<title>Powers & Grant, Inc.</title>
<meta charset="utf-8">
</head>
<body>
\t <div id="wrap">
\t \t <div id="nav">
\t \t <ul>
\t \t \t <li><a href="index.html">Home</a></li>
\t \t \t <li><a href="whoweare.html">Who We Are</a></li> \t
\t \t \t <li><a href="whatwedo.html">What We Do</a></li>
\t \t \t <li><a href="ourservices.html">Our Services</a></li>
\t \t \t <li><a href="thepowersteam.html">The Powers Team</a></li>
\t \t \t <li><a href="contact.html">Contact</a></li>
\t \t </ul>
\t \t </div>
\t \t
\t \t <div id="header"></div>
\t \t
\t \t <div id="content">
\t \t <p>As the Country's pioneer in sales force outsourcing, Powers knows the intricacies of managing the critical tasks involved in increasing revenues as well as saving the company from the costly maintenance of agents with minimal increase in sales growth.<br><br>
Powers and Grant Inc. currently handles and manages sales teams for various industries principally involved in the Real Estate, Consumer, and
Pharmaceutical and Direct Selling companies.<br><br>
We assist companies in enhancing their competitiveness through application of competencies and integrate these essential factors needed to survive
today's need for continued innovation.<br><br></p>
\t \t </div>
\t \t
\t \t <div id="footer">
\t \t
\t \t <div id="navbottom">
\t \t <ul>
\t \t \t <li><a href="index.html">Home</a></li>
\t \t \t <li><a href="whoweare.html">Who We Are</a></li> \t
\t \t \t <li><a href="whatwedo.html">What We Do</a></li>
\t \t \t <li><a href="ourservices.html">Our Services</a></li>
\t \t \t <li><a href="thepowersteam.html">The Powers Team</a></li>
\t \t \t <li><a href="contact.html">Contact</a></li>
\t \t </ul>
\t \t </div><br>
\t \t
\t \t <div id="copyright">Copyright © Powers and Grant, Inc. All Rights Reserved</div>
\t \t </div>
\t </div>
</body>
Пожалуйста, помогите! Заранее большое спасибо.
О, спасибо вам большое за вашу помощь! Это сработало! – captainpokey
встроенный блок означает размещение элементов рядом друг с другом. Элементы переходят к следующей строке, если недостаточно места для их размещения в одной строке. – Aakash
Еще раз спасибо за помощь! – captainpokey