What's new

Web Website nav bar problems help needed

  • Thread starter Zoid in Code
  • Start date
  • Views 517
Z

Zoid in Code

Enthusiast
Messages
447
Reaction score
49
Points
85
Sin$
0
I would like the "about" etc to more to the left than the right.

Any help?

css:
body {
padding-top: 50px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
}

.navbar-fixed-top .nav {
padding: 15px 0;
}

.navbar-fixed-top .navbar-brand {
padding: 0 15px;
}

@media(min-width:768px) {
body {
padding-top: 50px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
}

.navbar-fixed-top .navbar-brand {
padding: 15px;
}
.main-header{
font-family: sans-serif;
font-size: 35px;
padding-left: 10px;
}
.main_header_part h1{

color: green;
display: inline-block;

}
.left {
float: left;
padding: 5px;
padding-left: 15px;

}

.right {
float: right;
padding-top: 5px;
}
.button{
padding: 5px;
background-color: #1E1F6C;
color: #ffffff;
border-radius: 8px;
padding-top: 5px;
}
h3 {

padding-bottom: 10px;
}

HTML:
<!DOCTYPE html>

<html lang="en">
<head>
<title>Unity Code</title>
<link rel="shortcut icon" href="img/favicon.ico" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style/styles.css">
<link rel="stylesheet" href="style/bootstrap.min.css">
<link href="logo-nav.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="style/script.js"></script>
<script src="style/jquery.js"></script>
<script src="style/bootstrap.min.js"></script>
<script src="style/bootstrap.min.js"></script>
<script src="style/jquery.js"></script>


</head>

<body>

<body>

<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<h3><span style="color:#47C8EA;">Unity</span><span style="color: #C2BFBF;">Code</h3>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<div class="testing">
<ul class="nav navbar-nav">
<li>
<a class="navbar-buttons" href="#">About</a>
</li>
<li>
<a class="navbar-buttons" href="#">Services</a>
</li>
<li>
<a class="navbar-buttons" href="#">Contact</a>
</li>
</div>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>


</body>
}
.navbar-buttons{
padding: 1588px;

My site: http://www.unity-code.org/
 
ZZ9 x iCaLZz

ZZ9 x iCaLZz

Newbie
Messages
8
Reaction score
4
Points
45
Sin$
0
Could you please go more in-depth with your question please, I could not understand what the problem was?
 
Top Bottom
Login
Register