www.velophotosbyjoe.com (http://www.velophotosbyjoe.com)
I can't get my navbar to line up on the same line as my banner image. Could someone please help me to correct my coding?
- Joe
Hi Joe, give this a try:
Change your custom header box to this, that way you now have an ID for your banner and the header line and you can style them however you want! You also might want to remake your banner as a transparent .png, so it blends into your site. :thumb
<div id="my_banner"> <img src="http://photos-by-joe.smugmug.com/photos/479965423_4AgaU-O.png"></div>
<div id="navcontainer">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/galleries">Galleries</a></li>
<li><a href="mailto:joseph.marinelli@gmail.com">Email me</a></li>
</ul>
</div>
<div id="my_header"></div>
Change your CSS Box to this:
/*=====Banner=====*/
#my_banner
{height: 48px;
margin-left:15px;
margin-top:10px;}
/*=====Nav-Bar=====*/
#navcontainer ul
{margin: 0;
padding: 0;
list-style-type: none;
text-align: right;}
#navcontainer ul li
{display: inline;}
#navcontainer ul li a
{text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #0;}
#navcontainer ul li a:hover
{color: #fff;
background-color: #0;}
/*=====Header Line=====*/
#my_header
{border-width: 1px;
border-bottom: double;
border-bottom-color: grey;}
#userHome,
.homepage #galleryTitle,
#categoriesBox .boxTop,
#userName,
#bioBox .photo,
#feeds
{display:none;}
#homepage,
#bioBox
{margin: 0 auto;
width: 650px;}
#userBio
{text-align: center !important;}
:ear