I am trying to do a nav bar that has curvy edges on each side. I want the middle part of the button to be extend-able however. Here is the code i have so far Any help would be appreciated
http://www.dynamicdrive.com/style/csslibrary/item/corp_blue_css_menu/ This is a easy resource on rounded corner css menu. Hope that gives you some direction. try around with this. I am sure you'll be able to get it done. Please keep us posted. Thanks
You could also try use CC3 to add rounded corners. This is the easiest solution. This method doesn't work on older browsers (which will show the buttons square). CSS -moz-border-radius: 5px; -webkit-border-radius: 5px; Code (markup): Source http://www.css3.info/preview/rounded-border/ Alternatively you could use a background image on these 2 elements: the LI and the A. Where the LI provides the the right side and background of the button and the A the left side of the button. The buttons won't be flexible in height this way. This is called the sliding door technique and documented quite well on ALA (A List Apart). Sliding doors http://www.alistapart.com/articles/slidingdoors2/
The best way I found was using css3 to display multiple backgrounds but its not supported by all browsers yet. I tried sliding doors on my own but didnt turn up exactly as I wanted, I am going to check out the article and wish for better luck second time around!