|
|
Thread Tools | Display Modes |
|
#1
|
|
|
Major grins
|
HTML nav bar help
Sorry if this is a dumb question, I barely know anything about HTML. I am having trouble with my header. I want the logo picture to stay to the left, and the whole nav bar to stay to the right. Thanks!
Website: www.jarboedoggart.com HTML: <div> <left> <a href="http://www.jarboedoggart.com/"> <img src=http://jarboedoggart.smugmug.com/photos/1080967244_XKThS-O.png border="0" alt="GALLERY" /></a> </left> <right> <a href="http://www.jarboedoggart.com/Gallery/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478506_deH9Y-O.png" border="0" alt="GALLERY" /></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"/> <a href="http://www.jarboedoggart.com/Services/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478498_2i8np-O.png" border="0" alt="SERVICES/PRICING" /></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"/> <a href="http://www.jarboedoggart.com/Other/Contact/11186492_itubQ#000000_" target="_blank"> <img src="http://jarboedoggart.smugmug.com/photos/1083478496_wBRHJ-O.png" border="0" alt="CONTACT" /></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"/> <a href="http://www.jarboedoggart.com/Other/About/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478544_qiFwS-O.png" border="0" alt="ABOUT US" /></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"/> <a href="http://www.jarboedoggart.com/Special-Requests/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478540_bMaw4-O.png" border="0" alt="LOGIN" /></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"/> <a href="http://www.facebook.com/pages/Jarboe-Doggart-Photography/127596450590245/" target="_blank"> <img src="http://jarboedoggart.smugmug.com/photos/1083478553_qytEH-O.png" border="0" alt="FACEBOOK" /></a> </right> <BR> <BR> </div> |
|
|
|
|
#2
|
|
|
Major grins
|
Try something like this instead.....
Change your custom header box to this: Code:
<div id="my-header"> <div id="my-logo"> <a href="http://www.jarboedoggart.com/"> <img src="http://jarboedoggart.smugmug.com/photos/1080967244_XKThS-O.png" alt="GALLERY" border="0"></a> </div> <div id="my-nav"> <a href="http://www.jarboedoggart.com/Gallery/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478506_deH9Y-O.png" alt="GALLERY" border="0"></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"> <a href="http://www.jarboedoggart.com/Services/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478498_2i8np-O.png" alt="SERVICES/PRICING" border="0"></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"> <a href="http://www.jarboedoggart.com/Other/Contact/11186492_itubQ#000000_" target="_blank"> <img src="http://jarboedoggart.smugmug.com/photos/1083478496_wBRHJ-O.png" alt="CONTACT" border="0"></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"> <a href="http://www.jarboedoggart.com/Other/About/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478544_qiFwS-O.png" alt="ABOUT US" border="0"></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"> <a href="http://www.jarboedoggart.com/Special-Requests/"> <img src="http://jarboedoggart.smugmug.com/photos/1083478540_bMaw4-O.png" alt="LOGIN" border="0"></a> <img src="http://jarboedoggart.smugmug.com/photos/1083525476_Be9EG-O.png" border="0"> <a href="http://www.facebook.com/pages/Jarboe-Doggart-Photography/127596450590245/" target="_blank"> <img src="http://jarboedoggart.smugmug.com/photos/1083478553_qytEH-O.png" alt="FACEBOOK" border="0"></a> </div> <div style="clear: both;"></div> </div> Then add this to your CSS box: Code:
#my-logo {float:left}
#my-nav {float:right;padding:130px 20px 0px 0px}
Your nav-bar images are almost to big to line these two things up together...re size your browser window to see what I mean after you get this done... |
|
|
|
|
#3
|
|
|
Major grins
|
With a little tweaking of the padding pixel amount, that worked perfectly. Thank you very much!
|
|
|
|
| Tell The World! | |
| Similar Threads | Thread Starter | Forum | Replies | Last Post | ![]() |
| How To Maximize Your Findability (Search Engine Stuff) | Andy | SmugMug Support | 1039 | Jun-18-2012 05:30 AM | |
| problems with firefox and filmstrip | JLC04 | SmugMug Customization | 4 | Sep-21-2007 07:28 AM | |
| Adding images to html only page | lizstabbertphoto | SmugMug Customization | 2 | Sep-10-2007 06:52 PM | |
| Header and Footer questions | MAHAROGERS | SmugMug Customization | 29 | Mar-27-2007 02:30 AM | |
| Why not our own HTML entry pages? | jfriend | SmugMug Support | 10 | Mar-08-2005 09:30 PM | |
| Thread Tools | |
| Display Modes | |
|
|