Trouble centering main nav menu

Hello, and thanks for such a nice theme.

I have downloaded and activated the latest version of Responsive, and I’ve made a child theme of it, in which I’m centering the main nav menu with CSS.

The problem is that while the nav menu shows properly centered when the website loads, as soon as the width of the browser screen is changed any at all, then the UL content inside #main-nav.main-nav jumps from centered to left aligned.

I’m baffled on how to either get the content to “stay” centered or how to reduce the width to “auto” instead of a needlessly wide 910px, which is wider than my current nav menu choices need.

This does not seem to be due to a Media inquiry, because the broken centering stays broken even if I widen the browser wider than it was before the centering gets broken.

Here’s the pertinent CCS I’m trying in my styles.css file in the child theme:

/* Center the main nav */

nav#main-nav, nav#main-nav.main-nav {
	text-align: center;
	margin-left: auto;
	margin-right: auto;	
	width: auto;
}

menu-main-menu {
	text-align: center;
	margin-left: auto;
	margin-right: auto;	
	width: auto;
}

nav.main-nav {
	width: auto;
}

I sure would appreciate if anyone can help me solve this.

Thanks in advance.