I have my primary menu rounded using border radius and I was able to remove the last separator from the menu but I can't seem to get rid of the first. I've been searching all around and can't find any ideas.
Here's a picture of my problem
http://dl.dropbox.com/u/7467628/Untitled.png

I also haven't been able to get the menu to display with rounded corners in IE either (using every border radius code i know).. its not that important but if anyone happens to know why that might be that'd be good to know.

Thanks in advance for any responses. This has been driving me crazy.

Comments

enzipher’s picture

Hi there,

As I don't have the source code I can't tell you where the line is coming from, but it's possible you can remove it with css if your theme uses the standard classes. Something like this if it's a border:

ul.primary-links li.first {
  border-left: 0 none;
}

If you are using anything less than IE9 you won't get rounded corners to work without help. Here are a couple of solutions that has worked for me previously:
- http://www.curvycorners.net
- http://css3pie.com

Cheers,

--

hook_world() is broken.

dougwein’s picture

I actually tried that in CSS. that's how I was able to remove the separator from the last item but it doesn't work for the first. All of the classes are standard to the Acquia Prosper theme. I'm not that great at theming or CSS I do have some experience in coding java which helps me a bit. I just have no idea what controls the separators in that menu and I can't find anything in my searches.

dougwein’s picture

After searching through all my CSS files I found the one that controls the borders. Not sure why my other file didn't override it but oh well I'll just change it there.

enzipher’s picture

Glad you sorted it out. If you don't already you should use Firefox with the Firebug extension. It helps a great deal in quickly finding quirks like this.

http://www.mozilla.com/en-US/firefox/
https://addons.mozilla.org/en-US/firefox/addon/firebug/

Cheers,

--

hook_world() is broken.

dougwein’s picture

Thanks, I'm not a huge fan of firefox anymore. I've been using Chrome and their development tools are pretty good. I had trouble finding the css file because I was using CSS aggregation.

Jeremy Toaster’s picture

.primary-menu-inner ul.menu li a:link,
.primary-menu-inner ul.menu li a:visited {
	border-left: 0px;
}

.primary-menu-inner ul li.last a,
.primary-menu-inner ul.sf-menu li.last {
	border-right: 0px;
}

Put these in your local.css file and it should kill the border spacers. They were being created in the gray.css file.