Nav Bar #access a, il, ul adjustments

I use Twenty Eleven theme and editing the child theme to look like my website. Here are the test sites: in website root integrated word press blog https://testblog.dacesita.com/ and the website to compare to: https://test.dacesita.com/bio-pics.html

I struggle with nav bar. Each menu point has to be exactly the same length and not overlapping. Yet I can’t get to it.

Basically to get it to this point I had to play around with numbers for height and width. And still the distance between the

s is a bit wider than I need. Seems like the width of each ul changes depending on every other value I try to adjust. And I can’t get the text to be in middle of each ul. Horizontally yes, but not vertically. Whenever I play around the margin, the pink background displaces to right or bottom. Padding doesn’t affect anything either. Also, I had to adjust margin to -72px in order to have it to the left
‘#access ul {
font-size: 17px;
list-style: none;
margin: 0 0 0 -72px;}’

I rather would have the margin-left at zero and move the individual

• s to the left. seems not possible. if I do something either the pink background will move or the entire black menu will move.

1) which value do I have to adjust to get each ul at the same length and stand independently?

2) which value I have to adjust to get the text in middle vertically?

I also have an impression that the containing <div> values change automatically as I adjust width or height. I can see, for instance 43px, but the actual height is 56px. and so on.

thanks in advance.