|
|
Thread Tools | Display Modes |
|
#1
|
|
|
Photographic Artist
|
Navbar Glitch in IE, works fine in Safari/Chrome
I've customized a navbar code I found in the forum. I wish I could remember who and give credit for their awesomeness! Anyway, the navbar displays properly in Safari and Chrome, but not IE. The code had provided specific extra codes for IE and after several weeks of playing I've still not figured out how to fix it. In IE the last drop down on the end for 'Articles' runs outside of the navbar by underlining my bio box text and creating a link to 'Articles'. It also forms a break between my slideshow and Twitter feed. If anyone has multiple browsers, I appreciate your help. Let me know what code you need. My site is in my signature. Thanks!
__________________
SmugMug: http://soulgazephotography.smugmug.com/ Social media links, portfolio and bio on my website. ^ Proud & helpful Smugger! Please hire me for Support Hero!! :) I've only bugged Jill since April 2011 and I even wrote a poem!! |
|
|
|
|
#2
|
|
|
Smug Hero
|
At the very end of your custom header box you have this:
Code:
</li> <li></div> <!-- End Drop Nav Bar--> <center><div id="mysearch">SMUGSEARCH</div></center> Code:
</li> </div> </div> <!-- End Drop Nav Bar--> <center><div id="mysearch">SMUGSEARCH</div></center> |
|
|
|
|
#3
|
|
|
Photographic Artist
|
Thank you for helping Eric, I changed the code and there were no changes...do you have any more ideas? I'm all out...logically ending the div should've worked.
__________________
SmugMug: http://soulgazephotography.smugmug.com/ Social media links, portfolio and bio on my website. ^ Proud & helpful Smugger! Please hire me for Support Hero!! :) I've only bugged Jill since April 2011 and I even wrote a poem!! |
|
|
|
|
#4
|
||
|
"tweak 'til it squeaks"
|
Quote:
This much done so far. Don't use this until it's all finished. Code:
<!-- Drop Nav Bar -->
<div align="center">
<div class="menu">
<ul>
<li><a href="/" title="Welcome! to Soul Gaze Photography">Home</a></li>
<li><a class="drop" href="#noclick">About
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/gallery/13856119_UMCNW" title="About Me">About The Photographer</a></li>
<li><a href="http://soulgazephotography.wordpress.com/" target="blank" title="Blog opens in new window">BLOG</a></li>
<li><a href="/gallery/14074201_ibfvT" title="My Gear & favorites">My Gear</a></li>
<li><a href="/gallery/13838117_2gXLE" title="Read & say Hello!">Comments & Reviews</a></li>
<li><a href="http://www.facebook.com/soulgazephotography" target="blank" title="Facebook opens in new window">Like on Facebook</a></li>
<li><a href="http://www.twitter.com/Amber_Flowers" target="blank" title="Twitter opens in new window">Follow on Twitter</a></li>
<li><a href="http://www.sokyphotographers.ning.com" target="blank" title="Opens in new window">Southern Kentucky Photographer's Club</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#noclick" title="">Contact
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://www.contactme.com/4cb66c842e866a744200040f" target="blank" title="Contact me opens in new window">Contact Me</a></li>
<li><a href="http://soulgazephotography.bookmonline.com/schedules" target="blank" title="Make an appointment-opens in new window">Reservations</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="http://www.soulgazephotography.com/Photography-Portfolio" title="All items with '*' require password">Portfolio
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://amber-flowers.artistwebsites.com/index.html" target="blank" title="Opens in new window-30 day guarantee!">Purchase: Fine Art</a></li>
<li><a href="http://soulgazephotography.smugmug.com/Information/Products/Products/13778902_t66Ab#1008683859_Ehqo9" title="Custom Products">Purchase: Custom Products</a></li>
<li><a class="drop" href="/Photography-Portfolio/Digital-Manipulations" title="Computer Edited">Digital Manipulations
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Digital-Manipulations/People/12426119_ANRGg" title="Edited People">Manipulated People</a></li>
<li><a href="/Photography-Portfolio/Digital-Manipulations/OtherManipulations/12500750_ZYyL3" title="Random Edits">Other Manipulations</a></li>
<li><a href="/Photography-Portfolio/Digital-Manipulations/Abstract-1/12426425_SJDLx" title="Extreme Edits">Abstract Manipulations</a></li>
<li><a href="/Digital-Manipulations-2/Mobile-Photos/17027460_V2XnSs" title="Mobile Creations">Mobile Photos</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Infrared-Photography" title="White foliage-my most popular gallery">Infrared Photography
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Infrared-Photography/Nikon-D40/12426526_AdTN9" title="Current IR Work">Nikon D40</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/canon-s5is/12426531_o38GC" title="Older IR Work">Canon S5IS</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/Canon-A70/12426533_a7WqZ" title="First IR Work">Canon A70</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/Infrared-People/12426535_c6KtB" title="IR people">Infrared People</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/Infrared-Manipulations/12426414_3Wiz6" title="IR Edits">Infrared Manipulations</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/People" title="People">People
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/People/People/12414713_2sWsR" title="People">People</a></li>
<li><a href="/Photography-Portfolio/People/Children/12426417_xHmZz" title="Children">Children</a></li>
<li><a href="/Photography-Portfolio/People/Bands/12426511_rbexQ" title="Bands">Bands</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Nature-and-Outdoors" title="Nature & Outdoors">Nature & Outdoors
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Outdoors/12426552_ZRSUb" title="Outdoors">Outdoors</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Weather-1/12448103_nxaBF" title="Weather">Weather</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Plants/12500149_jK4qb" title="Plants">Plants</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Animals/12426727_MVF5q" title="Animals">Animals</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Insects/12500751_uv6Gi" title="Insects">Insects</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/After-The-Rain/13887192_2rTWJ" title="Rain, butterflies & flowers">After The Rain</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Luna-Moth/17428653_wpdkd7#1340510832_PCF7sNZ" title="Luna Moth">Luna Moth</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/December-2010-Snow/15094567_V6CUt" title="Winter Snow in Woods">Winter 2010</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Manmade" title="Manmade">Manmade
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Manmade/Man-Made/12448116_npyJr" title="Manmade">Manmade</a></li>
<li><a href="/Photography-Portfolio/Manmade/Old-Edmonton-High-School/13124222_r5Y2d" title="Donate-Help save this place!">Old Edmonton High School</a></li>
<li><a href="/Photography-Portfolio/Manmade/Fort-Williams-Glasgow-Kentucky/17075656_RwwmS2" title="Glasgow, KY">Fort Williams</a></li>
<li><a href="/Photography-Portfolio/Manmade/1882-Jim-Crow-Passenger-Car/17260748_TgcQW8" title="1883 Jim Crow Passenger Car">1882 Jim Crow Passenger Car</a></li>
<li><a href="/Photography-Portfolio/Manmade/Barren-River-Lake-4th-of-July/17954758_x9PTCP" title="Barren River Lake Fireworks">Barren River Lake Fireworks</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Journalism" title="Journalism">Journalism
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Journalism/Journalism/15150393_wm4GT" title="Assorted Journalism">Mixed Journalism</a></li>
<li><a href="/Photography-Portfolio/Journalism/Barren-County-Relay-For-Life/17155840_4MVq9F" title="Barren County Relay For Life 2011">BC Relay For Life 2011</a></li>
<li><a href="/Photography-Portfolio/Journalism/HWY-90-Wreck-6-3-11/17386668_BK67HS" title="HWY 90 Wreck 6-3-11">HWY 90 Wreck</a></li>
<li><a href="/Photography-Portfolio/Journalism/Glasgow-Flood-May-2nd-2010/15496687_JeLUs" title="May 2nd 2010">Glasgow Flood</a></li>
<li><a href="/Photography-Portfolio/Journalism/Kmart-Wreck/13582870_GJihz" title="Wreck at Kmart">Kmart Wreck</a></li>
<li><a href="/Photography-Portfolio/Journalism/Brandon-ER-7-18-10/12992176_8L4j3" title="WARNING GRAPHIC!">Laceration at ER</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Realty" title="Realty">Realty
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Realty/117-Chinaberry-St/12415446_GWyYg" title="SOLD!">117 Chinaberry</a></li>
<li><a href="/Photography-Portfolio/Realty/Nobob/12624296_z94Up" title="LOCKED">*Nobob</a></li>
<li><a href="/Photography-Portfolio/Realty/River-Oaks/15080054_bG8yQ" title="LOCKED">*River Oaks</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Design" title="Design">Design
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Design/Logo-Design/12426576_Souo3" title="Logo & Marketing">Logo & Marketing</a></li>
<li><a href="/Photography-Portfolio/Design/Websites-and-Profiles/15785139_SVVR9" title="Websites & Profiles">Websites & Profiles</a></li>
<li><a href="/Photography-Portfolio/Design/Cards-and-Templates/12426758_Nk8GV" title="Cards & Templates">Cards & Templates</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
...
...
Code:
/------------------- // Start Nav //------------------- Fix all the other instances of this in your CSS. Code:
/*------------------- Start Nav -------------------*/
__________________
Al My Website my Blog Mozilla Firefox Web Developer Firebug Customization FAQ Banner/Navbar/Slideshow Tutor Last edited by Allen; Jul-26-2011 at 06:50 PM. |
|
|
|
||
|
#5
|
||
|
"tweak 'til it squeaks"
|
Quote:
Code:
<!-- Drop Nav Bar -->
<div class="menu">
<ul>
<li><a href="/" title="Welcome! to Soul Gaze Photography">Home</a></li>
<li><a class="drop" href="#noclick">About
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/gallery/13856119_UMCNW" title="About Me">About The Photographer</a></li>
<li><a href="http://soulgazephotography.wordpress.com/" target="blank" title="Blog opens in new window">BLOG</a></li>
<li><a href="/gallery/14074201_ibfvT" title="My Gear & favorites">My Gear</a></li>
<li><a href="/gallery/13838117_2gXLE" title="Read & say Hello!">Comments & Reviews</a></li>
<li><a href="http://www.facebook.com/soulgazephotography" target="blank" title="Facebook opens in new window">Like on Facebook</a></li>
<li><a href="http://www.twitter.com/Amber_Flowers" target="blank" title="Twitter opens in new window">Follow on Twitter</a></li>
<li><a href="http://www.sokyphotographers.ning.com" target="blank" title="Opens in new window">Southern Kentucky Photographer's Club</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#noclick" title="">Contact
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://www.contactme.com/4cb66c842e866a744200040f" target="blank" title="Contact me opens in new window">Contact Me</a></li>
<li><a href="http://soulgazephotography.bookmonline.com/schedules" target="blank" title="Make an appointment-opens in new window">Reservations</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="http://www.soulgazephotography.com/Photography-Portfolio" title="All items with '*' require password">Portfolio
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://amber-flowers.artistwebsites.com/index.html" target="blank" title="Opens in new window-30 day guarantee!">Purchase: Fine Art</a></li>
<li><a href="/Information/Products/Products/13778902_t66Ab#1008683859_Ehqo9" title="Custom Products">Purchase: Custom Products</a></li>
<li><a class="drop" href="/Photography-Portfolio/Digital-Manipulations" title="Computer Edited">Digital Manipulations
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Digital_Manipulations/People/12426119_ANRGg" title="Edited People">Manipulated People</a></li>
<li><a href="/Photography-Portfolio/Digital_Manipulations/OtherManipulations/12500750_ZYyL3" title="Random Edits">Other Manipulations</a></li>
<li><a href="/Photography-Portfolio/Digital_Manipulations/Abstract-1/12426425_SJDLx" title="Extreme Edits">Abstract Manipulations</a></li>
<li><a href="/Digital-Manipulations-2/Mobile-Photos/17027460_V2XnSs" title="Mobile Creations">Mobile Photos</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Infrared-Photography" title="White foliage-my most popular gallery">Infrared Photography
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Infrared-Photography/Nikon-D40/12426526_AdTN9" title="Current IR Work">Nikon D40</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/canon-s5is/12426531_o38GC" title="Older IR Work">Canon S5IS</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/Canon-A70/12426533_a7WqZ" title="First IR Work">Canon A70</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/Infrared-People/12426535_c6KtB" title="IR people">Infrared People</a></li>
<li><a href="/Photography-Portfolio/Infrared-Photography/Infrared-Manipulations/12426414_3Wiz6" title="IR Edits">Infrared Manipulations</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/People" title="People">People
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/People/People/12414713_2sWsR" title="People">People</a></li>
<li><a href="/Photography-Portfolio/People/Children/12426417_xHmZz" title="Children">Children</a></li>
<li><a href="/Photography-Portfolio/People/Bands/12426511_rbexQ" title="Bands">Bands</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Nature-and-Outdoors" title="Nature & Outdoors">Nature & Outdoors
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Outdoors/12426552_ZRSUb" title="Outdoors">Outdoors</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Weather-1/12448103_nxaBF" title="Weather">Weather</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Plants/12500149_jK4qb" title="Plants">Plants</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Animals/12426727_MVF5q" title="Animals">Animals</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Insects/12500751_uv6Gi" title="Insects">Insects</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/After-The-Rain/13887192_2rTWJ" title="Rain, butterflies & flowers">After The Rain</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/Luna-Moth/17428653_wpdkd7#1340510832_PCF7sNZ" title="Luna Moth">Luna Moth</a></li>
<li><a href="/Photography-Portfolio/Nature-and-Outdoors/December-2010-Snow/15094567_V6CUt" title="Winter Snow in Woods">Winter 2010</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Manmade" title="Manmade">Manmade
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Manmade/Man-Made/12448116_npyJr" title="Manmade">Manmade</a></li>
<li><a href="/Photography-Portfolio/Manmade/Old-Edmonton-High-School/13124222_r5Y2d" title="Donate-Help save this place!">Old Edmonton High School</a></li>
<li><a href="/Photography-Portfolio/Manmade/Fort-Williams-Glasgow-Kentucky/17075656_RwwmS2" title="Glasgow, KY">Fort Williams</a></li>
<li><a href="/Photography-Portfolio/Manmade/1882-Jim-Crow-Passenger-Car/17260748_TgcQW8" title="1883 Jim Crow Passenger Car">1882 Jim Crow Passenger Car</a></li>
<li><a href="/Photography-Portfolio/Manmade/Barren-River-Lake-4th-of-July/17954758_x9PTCP" title="Barren River Lake Fireworks">Barren River Lake Fireworks</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Journalism" title="Journalism">Journalism
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Journalism/Journalism/15150393_wm4GT" title="Assorted Journalism">Mixed Journalism</a></li>
<li><a href="/Photography-Portfolio/Journalism/Barren-County-Relay-For-Life/17155840_4MVq9F" title="Barren County Relay For Life 2011">BC Relay For Life 2011</a></li>
<li><a href="/Photography-Portfolio/Journalism/HWY-90-Wreck-6-3-11/17386668_BK67HS" title="HWY 90 Wreck 6-3-11">HWY 90 Wreck</a></li>
<li><a href="/Photography-Portfolio/Journalism/Glasgow-Flood-May-2nd-2010/15496687_JeLUs" title="May 2nd 2010">Glasgow Flood</a></li>
<li><a href="/Photography-Portfolio/Journalism/Kmart-Wreck/13582870_GJihz" title="Wreck at Kmart">Kmart Wreck</a></li>
<li><a href="/Photography-Portfolio/Journalism/Brandon-ER-7-18-10/12992176_8L4j3" title="WARNING GRAPHIC!">Laceration at ER</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Realty" title="Realty">Realty
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Realty/117-Chinaberry-St/12415446_GWyYg" title="SOLD!">117 Chinaberry</a></li>
<li><a href="/Photography-Portfolio/Realty/Nobob/12624296_z94Up" title="LOCKED">*Nobob</a></li>
<li><a href="/Photography-Portfolio/Realty/River-Oaks/15080054_bG8yQ" title="LOCKED">*River Oaks</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Photography-Portfolio/Design" title="Design">Design
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Design/Logo-Design/12426576_Souo3" title="Logo & Marketing">Logo & Marketing</a></li>
<li><a href="/Photography-Portfolio/Design/Websites-and-Profiles/15785139_SVVR9" title="Websites & Profiles">Websites & Profiles</a></li>
<li><a href="/Photography-Portfolio/Design/Cards-and-Templates/12426758_Nk8GV" title="Cards & Templates">Cards & Templates</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#noclick" title="Other Galleries">Other Galleries
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Barren-%0D%0ARiver-Lake-Trip/14181923_vS9io" title="Barren River Session">Barren River Lake Portrait Session</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="/Information/Downloads/15496712_JboJH" title="Free Soul Gaze Photography Wallpaper">Freebies</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="/Client-Proofing" title="View and purchase your images">Client Proofing</a></li>
<li><a class="drop" href="#noclick">Information
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Information/Services/Included-Editing-Services/15947704_zCSSj" title="Custom Creativity!">Included Editing</a></li>
<li><a href="/Information/Services/Prices/13778893_ta4bP" title="Important Information About Sessions">Investment & Print Prices</a></li>
<li><a href="/Information/Help/Session-FAQ/17402803_3XmtcK" title="Common Questions Answered!">Session FAQ</a></li>
<li><a href="/Information/Help/help/15519214_FqCCQ" title="How do I view/purchase photos?">Gallery Help</a></li>
<li><a href="/Information/Help/copyright-and-licensing/16400546_FchLA" title="Unauthorized image use is illegal!">Copyright & Licensing</a></li>
<li><a href="/Information/Help/Terms-of-Service/15519319_N2v4r" title="By using this site you agree">Terms & Conditions</a></li>
<li><a href="/Information/astore/14074201_ibfvT" title="Contact me to purchase ad space">Sponsors & Affiliates</a></li>
<li><a href="/Information/Donate/16400439_wm8WG" title="Support SGP or SOKYPC">Donate</a></li>
<li><a href="/Information/Services/Website-Ads/13470139_uDjx8" title="Ads support us both!">Purchase Ads for SGP or SOKYPC</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#noclick">Services
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Services/Sessions/17220810_Sh55WH" title="Sessions">Sessions</a></li>
<li><a href="/Services/Infrared-Photography/17232700_rjBSFq" title="Infrared Photography">Infrared Photography</a></li>
<li><a href="/Services/Events/17220278_43Z7MV" title="Events">Events</a></li>
<li><a href="/Services/Weddings/17220137_GjLjCn" title="Weddings">Weddings</a></li>
<li><a href="/Services/Realty/17219934_FNDcKX" title="Sell your property faster!">Realty</a></li>
<li><a href="/Services/Automotive-and-Product/17220419_zB2rs9" title="Sell your car or product faster!">Automotive & Product</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="/Information/Articles/13839837_QZonr" title="Articles and more">Writing
<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Photography-Portfolio/Infrared%0D%0A-Photography/About-Infrared/14105341_grwuG" title="Tutorial and FAQ">What is Infrared?</a></li>
<li><a href="/Information/Articles/13839837_QZonr" title="Photography articles for Bowling Green's Amplifier Magazine">Amplifier Articles</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
<!-- End Drop Nav Bar-->
Code:
.homepage .menu {display:none;}
/* CSS Dropdown Nav Bar */
/* Original code by Stu Nicholls of */
/* http://www.cssplay.co.uk/ */
/* Edited for content, formatting and some elements */
/* Please help support CSSPlay at: */
/* http://www.cssplay.co.uk/support.html */
/* CSS Section */
/* style the outer div to give it width */
.menu {
z-index:99;
position:relative; /* Make the container moveable */
margin: 0 auto 20px; /* top R/L bottom */
width:700px; /* Main bar total width, minimize to not wrap to two lines*/
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none;
}
/* float the list to make it horizontal and a relative position so that you can control the dropdown menu positon */
.menu li {
float:left; /* float right will reverse the main buttons */
text-align:center;
width:auto;
position:relative;
padding: 0;
}
/* style the links for the top level */
.menu a, .menu a:visited {
display:block;
text-decoration:none; /* none, overline, underline */
color:white;
background:black;
border:1px solid #fff; /* optional */
border-width:1px 1px 1px 1px; /* optional */
font-size:11pt;
font-family: "Gentium","Times New Roman", times, serif;
width:auto; /* Defines the main box dimensions. */
height:20px; /* How tall your cells are */
line-height:20px; /* vertical text alignment in cell */
padding: 0 10px; /* top/bottom R/L */
min-width: 60px; /* set to smallest text and use R/L padding above to space out */
}
/* main hover */
.menu a:hover, .menu :hover > a {
color:black;
background:white;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:130px; w\idth:130px;}
/* style the table so that it takes no part in the layout */
.menu table {position:absolute; top:0; left:0;}
/* ***** LEVEL 2 ***** LEVEL 2 ***** LEVEL 2 ***** */
/* another hack for IE5.5 */
* html .menu ul ul {top:20px; t\op:21px;} /* IE gap between main bar and the dropdown items */
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:20px; /* move drop vertically */
left:0; /* move drop horizontally */
width:134px; /* Size of the daughter cells */
}
/* style the second level background non-hover */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:black;} /* if 3rd level exists */
/* style the second level hover */
.menu ul ul a.drop:hover {background:black;}
.menu ul ul :hover > a.drop {background:black;}
/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
color:white;
background:black;
height:auto;
line-height:18px;
width:134px;
font-size:10pt;
}
.menu ul ul :hover > a.drop {background:white;} /* 2nd if 3rd level exists */
/* yet another hack for IE5.5 */
* html .menu ul ul a {width:120px; w\idth:120px;}
/* 2nd level hover */
.menu ul ul a:hover, .menu ul ul :hover > a {
color:black;
background:white;
}
/* ***** LEVEL 3 ***** LEVEL 3 ***** LEVEL 3 ***** */
/* position the third level flyout menu */
.menu ul ul ul {
left:156px;
top:0;
width:134px;
height:auto;
}
.menu ul ul ul li a {color:white;}
.menu ul ul ul li a:hover {color:black;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:black;} /* not FF */
/* style the third level hover */
.menu ul ul ul a:hover {background:white;}
.menu ul ul ul :hover > a {background:white;} /* 3rd (w/o 4th) 4th hover */
/* style the third level links */
.menu ul ul ul a, .menu ul ul ul a:visited {
color:white; /* hover 2nd > 3rd & 4th */
background:black; /* hover 3rd > 4th */
height:auto;
line-height:20px;
width:134px;
}
/* ***** LEVEL 4 ***** LEVEL 4 ***** LEVEL 4 ***** */
/* position the fourth level flyout menu */
.menu ul ul ul ul {
left:134px;
top:0;
width:134px;
height: auto !important;
}
/* 4th level non-hover */
.menu ul ul ul ul li a {
color:white;
width:134px;
}
/* style the fourth level hover */
.menu ul ul ul ul a:hover {background:black;}
.menu ul ul ul ul :hover > a {background:black;}
/* make the 2nd level visible when hover on 1st level */
.menu ul :hover ul {visibility:visible;}
/* make the 3rd level visible when you hover over 2nd level */
.menu ul :hover ul :hover ul {visibility:visible;}
/* make the 4th level visible when you hover over 3rd level */
.menu ul :hover ul :hover ul :hover ul {visibility:visible;}
/* keep the 3rd level hidden when you hover on 1st level */
.menu ul :hover ul ul {visibility:hidden;}
/* keep the 4th level hidden when you hover on 2nd level */
.menu ul :hover ul :hover ul ul {visibility:hidden;}
/* End Navbar Code */
Code:
Drop button doesn't change color on hover. I just noticed if a NiceName link is used, and the sub-cat is a niceName and has a dash (-) in it, the hover doesn't work. Change the dash to an underline and the button hover works.
__________________
Al My Website my Blog Mozilla Firefox Web Developer Firebug Customization FAQ Banner/Navbar/Slideshow Tutor |
|
|
|
||
|
#6
|
|
|
Photographic Artist
|
Where did you learn to do coding? I've been self-teaching myself the last couple years. The navigation was the biggest lesson. Took me several nights to add my links and I was proud. Then noticed the IE glitch. Everything worked perfectly in Safari and Chrome. I wasn't expecting anyone to take the time to rewrite the CSS and things, so I appreciate it. A couple questions:
1. All CSS in future needs to be /* explanation text here */ correct? What about HTML, is it still ok to use ///--------- etc to keep codes apart? 2. Is there a way to change the mouse when it hovers over the 'no click' top-level links like my old one? I want people to be able to understand which can and can't be clicked. 3. Will it mess anything up to rearrange and edit menus and add new links the way I could for my old code? Don't want to mess up your work! As for the disappearing 3rd-level menu...I see it too. Ironically it's NOT present in IE (all working perfectly!), but is in Chrome and Safari. I changed black to white under 4th level hover code and now some (not all) are working correctly in Chrome and Safari without altering the (-). I'm confused how it could be the (-) if all looks great in IE? Is there another way without manually changing the (-) on every link and future links? Thank you again for your coding awesomeness! I hope to one day help others more than just basic HTML!! :)
__________________
SmugMug: http://soulgazephotography.smugmug.com/ Social media links, portfolio and bio on my website. ^ Proud & helpful Smugger! Please hire me for Support Hero!! :) I've only bugged Jill since April 2011 and I even wrote a poem!! |
|
|
|
| Tell The World! | |
| Tags | |
| chrome , error , internet explorer , navbar , safari | |
| Similar Threads | Thread Starter | Forum | Replies | Last Post | ![]() |
| Custom category CSS view works fine with 5, breaks with 6 galleries | redshadow01 | SmugMug Customization | 10 | Nov-26-2009 07:03 PM | |
| NAV BAR trouble IE7 | voicelit | SmugMug Customization | 5 | Sep-03-2008 06:39 AM | |
| Navbar Pushes Breadcrumbs To Top | sealedglass | SmugMug Customization | 4 | Apr-25-2008 03:34 PM | |
| Andy, I messed up my site! Help! | snapapple | SmugMug Customization | 260 | Oct-02-2006 10:47 AM | |
| Navbar bottom padding: fine in IE, too small in FF...? | ChuckWC | SmugMug Customization | 3 | Sep-25-2006 09:49 AM | |
| Thread Tools | |
| Display Modes | |
|
|