Hi Peggy

Good work... thank you for sharing your solution to the forum.

Ciarán

Hi, The code provided did not work.

I resolved this issue by making my logo size the full width of the module space and placed the logo in that image where I wanted it. By doing this it bumped the navigation menu to the next line below.
I decided where I wanted the menu list to start from the left position and adjusted the padding accordingly. And did the same with the menu in the footer area.

Many thanks again for your excellent customer service!

Hi, this is not live but on my stand alone machine. There is no access. When this is put on the hosting website I will get back to you and ask you to check things out then.
I do appreciate and understand you need to check the live site.
Cheers,
Peggy

Hi Peggy

Would you have a URL to an example where the suggested CSS has been added and we will examine why your module positions are not re-positioned.

Removing the float on these positions and setting their width to 100% will place them in a single column rather than floating to the left and right.

Ciarán

Hi and thank you for your speedy response.

The coding did not budge either.
If header1 is positioned on the left side of the line and header2 is positioned on the right side of the same line - how can you center two items on the same line to the middle?
As it is with the size of the logo, header2 is being pushed below the logo. Neither is centering. This is why I was wondering if there is code to put header1 (logo) above header2? These two items are on the same line above the showcase - so it would be impossible to have them auto center because they conflict with each other on the same line.




I have to also say this is the best customer service I have ever experienced for response and help. Thank you so much.

Hi Peggy

To center both your header-1 and header-2 module positions try adding the following to the Custom CSS field of your templates parameters...

.header-1, .header-2 {

    float: none;

    text-align: center;

}

.header-1 .custom, .header-2 .custom {

    width: 100%;

} 

Ciarán