How to Center The Logo and Navigation Menu in Acoustic Theme

Posted in , , and tagged as , , .

Centering the Logo and the navigation menu of the Dandelion theme can be made with just a few lines on CSS code. Here is all the code you have to add to the Dandelion Options -> Styles Settings -> Additional Styles section:

– to center the logo only:

?
1
2
3
4
5
6
7
8
9
#logo-container a {
float: none;
margin-left: auto;
margin-right: auto;
}
 
#logo-container {
float: none;
}

-to center logo and navigation menu:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
#logo-container a {
float: none;
margin-left: auto;
margin-right: auto;
}
 
#logo-container {
float: none;
}
 
#menu-container {
float: none;
margin-left: auto;
margin-right: auto;
width: 700px;
}
 
#menu ul {
text-align: center;
}
Note: In this tutorial we are using Firebug. If you don’t know what Firebug is, please first visit the How to Customize Your Theme With Firebug article.

 

In the following video you can see how the changes take effect on the theme using a firebug:

Was this useful? 2