Comments on: How To Create An Auto Expanding Navigation Menu Using CSS http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css Sun, 12 Feb 2012 22:47:56 +0000 hourly 1 http://wordpress.org/?v=3.2.1 By: Simon Clavey http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-180389 Simon Clavey Sun, 31 Jul 2011 14:58:32 +0000 http://www.webdesigndev.com/?p=3454#comment-180389 Very nice tutorial, very easy to follow. Very nice tutorial, very easy to follow.

]]> By: Sharon http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-159619 Sharon Sun, 12 Jun 2011 01:00:45 +0000 http://www.webdesigndev.com/?p=3454#comment-159619 Thanks for this. I customized it for a template I'm working on. With a little tweaking of the padding, I got it to work great in IE8, Chrome and Safari. Lo and behold, the right side is shifted by one pixel in Firefox and doesn't show up at all in older versions of IE. Working on a solution. If I figure one out, I'll post it. Meanwhile, I managed to get it to work in FF and IE8 with an IE hack, but then it doesn't work in the other two. If only I could hack them all with custom stylesheets. But that doesn't do anything for the IE7 and below issue. I hear you on not being pixel perfect these days, but this particular effect looks far too obvious to just let it go. I'm trying not to have to go to a static width, but might have to just to get this job out the door. Thanks for the fun playing with it though. It's been bookmarked. Thanks for this. I customized it for a template I’m working on. With a little tweaking of the padding, I got it to work great in IE8, Chrome and Safari. Lo and behold, the right side is shifted by one pixel in Firefox and doesn’t show up at all in older versions of IE. Working on a solution. If I figure one out, I’ll post it.

Meanwhile, I managed to get it to work in FF and IE8 with an IE hack, but then it doesn’t work in the other two. If only I could hack them all with custom stylesheets. But that doesn’t do anything for the IE7 and below issue.

I hear you on not being pixel perfect these days, but this particular effect looks far too obvious to just let it go. I’m trying not to have to go to a static width, but might have to just to get this job out the door. Thanks for the fun playing with it though. It’s been bookmarked.

]]> By: Web Tasar?m? http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-121904 Web Tasar?m? Mon, 21 Feb 2011 15:01:36 +0000 http://www.webdesigndev.com/?p=3454#comment-121904 Great menu. Thanks a lot. Great menu. Thanks a lot.

]]> By: Igor http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-31949 Igor Mon, 23 Nov 2009 19:47:40 +0000 http://www.webdesigndev.com/?p=3454#comment-31949 Pretty cool ! Pretty cool !

]]> By: april jem http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-30465 april jem Sun, 08 Nov 2009 10:57:37 +0000 http://www.webdesigndev.com/?p=3454#comment-30465 Great Tut! It work! i hope your site will last a long time! god bless guys! you helped a lot!! Great Tut! It work! i hope your site will last a long time! god bless guys! you helped a lot!!

]]> By: designfollow http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-28148 designfollow Mon, 12 Oct 2009 14:39:56 +0000 http://www.webdesigndev.com/?p=3454#comment-28148 great post great post

]]> By: Jason http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-27260 Jason Wed, 30 Sep 2009 12:38:22 +0000 http://www.webdesigndev.com/?p=3454#comment-27260 Good writeup, cleaner markup than most solutions, although I like Phil's note about using the li element for one of the backgrounds. I don't have IE6 or 7 available to me at the moment, but if the "a:hover span" selector works properly in older versions of IE(back when only "a" elements could have :hover effects) that would be the push for the method shown here. If this method breaks in older versions of IE, then I would go with Phil, instead of using the span, use a style on li:hover for one of the background images. In regards to CSS3 methods to reproduce this effect - it should also be possible to do this once support of multiple background images comes into the mainstream, although this is still some ways off - further off than say, border radius support - but will hopefully allow much more semantic support of expanding boxes. Not to mention, multiple backgrounds will allow expansion of a box on both the x and y axis simultaneously, instead of only allowing the element to grow along one axis at a time as this method shows. Good writeup, cleaner markup than most solutions, although I like Phil’s note about using the li element for one of the backgrounds. I don’t have IE6 or 7 available to me at the moment, but if the “a:hover span” selector works properly in older versions of IE(back when only “a” elements could have :hover effects) that would be the push for the method shown here. If this method breaks in older versions of IE, then I would go with Phil, instead of using the span, use a style on li:hover for one of the background images.
In regards to CSS3 methods to reproduce this effect – it should also be possible to do this once support of multiple background images comes into the mainstream, although this is still some ways off – further off than say, border radius support – but will hopefully allow much more semantic support of expanding boxes. Not to mention, multiple backgrounds will allow expansion of a box on both the x and y axis simultaneously, instead of only allowing the element to grow along one axis at a time as this method shows.

]]> By: Niranjan Thilak http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-27258 Niranjan Thilak Wed, 30 Sep 2009 12:06:33 +0000 http://www.webdesigndev.com/?p=3454#comment-27258 It would be nice with all the CSS3effects especially the transitions effects but i guess we will be dead by the time IE supports it fully. When the time comes for ending <!-- if [ IE] --> Tag, Web will be a lot more speedier,faster, and hell lot cooler. It would be nice with all the CSS3effects especially the transitions effects but i guess we will be dead by the time IE supports it fully.

When the time comes for ending
Tag, Web will be a lot more speedier,faster, and hell lot cooler.

]]> By: Mr Javo http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-27183 Mr Javo Tue, 29 Sep 2009 17:21:55 +0000 http://www.webdesigndev.com/?p=3454#comment-27183 Pretty useful, thanks for sharing Pretty useful, thanks for sharing

]]> By: Lara http://www.webdesigndev.com/web-development/how-to-create-an-auto-expanding-navigation-menu-using-css/comment-page-1#comment-27147 Lara Tue, 29 Sep 2009 08:51:58 +0000 http://www.webdesigndev.com/?p=3454#comment-27147 you guys are the best :) you guys are the best :)

]]>