Page Numbers

Hello folks,
I’m trying to edit my little Wordpress WooCommerce web site and I’m bumbling into a few problems. I know a little HTML but I make pretty pictures for a living, so I get some very basic stuff quite wrong.

I need a helping hand, I can not work out why my page numbers code is not making the page numbers run “inline” on a horizontal line, inside of vertical.

I’m using the following css to overwrite the WooCommerce CSS for the “page-numbers” tag in my child theme.

.page-numbers {	display: inline;
	margin: 5px;
	color: #666;
	font-size: 1em;
	line-height: 1;
	text-decoration: none !important;
	padding: 5px 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	background: #000;
}

The code styles the page numbers how I want, but the page number blocks are vertical, not horizontal. :frowning:

What could I be doing wrong?