Title: Chosen Theme – Header alignment Last modified: August 31, 2016 --- # Chosen Theme – Header alignment * [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 12 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/) * Hi Guys, * I tried a few css codes in my custom css to place my header menu to the center but without any success. I also want my header to be fixed / sticky. I hope some of you can help me! Thanks in advance. * Homepage: [http://www.audio-mg.com](http://www.audio-mg.com) Theme: Chosen Viewing 15 replies - 1 through 15 (of 18 total) 1 [2](https://wordpress.org/support/topic/chosen-theme-header-alignment/page/2/?output_format=md) [→](https://wordpress.org/support/topic/chosen-theme-header-alignment/page/2/?output_format=md) * Anonymous User 14885823 * (@anonymized-14885823) * [9 years, 12 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381576) * Hello Maggie, * Right now you have your menu “floated” to the left and your social media icons to the right.. if you center your menu, what do you want your social media icons to do? * also, your menu is transparent right now, so if it is “fixed/sticky”, it will be very difficult to see when you scroll down and the menu is over content. If you want it to be stuck to the top of the screen, it might be good to change the background color of the menu. * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381652) * Hi, * it would be good if my menu has a different colour than the rest of my page so that I can use a sticky header. But same problem. I just don´t know how to change these parts of my homepage. You mean i´d be a problem if my menu is centered and the social icons are to the right? * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381658) * I guess vertical social icons to the right would look nice to me * Anonymous User 14885823 * (@anonymized-14885823) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381722) * Hello!! I’m really sorry, I was very busy at work all day yesterday. * you could try the following code in your custom CSS: * ``` .social-media-icons { position: fixed; right: 4em; top: 1em; } .social-media-icons li { display: block; margin-right: 0; } @media (min-width: 56.25em) .menu-primary { display: block; float: none; text-align: center; position: fixed; width: 100%; left: 0; top: 0; padding: 1em 0 0; background: url(http://audio-mg.com/wp-content/uploads/2016/05/5540936-cool-white-backgrounds.jpg); } ``` * That should center your menu and stick it to the top of the page. Right now, I just set the background to match the page.. But if you want to change it to a different color, just change the “background” at the bottom. The top two sections of css will also line up your social icons vertically and stick them in the top right corner. * Good luck!! Hope it works ok. Take care. * Also, I downloaded your mixtape. It sounds really good!! Have it playing right now. Music is life, keep doing what you love. Have a good one! * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381723) * Hi! Thanks for your reply…I tried adding the code to my custom css but unfortunately it has no effect. Only the social icons are vertical now. Your code is still in my CSS so you can see the result. Maybe it helps you to fix the problem. * PS: Thanks for your nice words in terms of my music…really appreciate it! * Anonymous User 14885823 * (@anonymized-14885823) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381726) * Ahhh, I’m sorry, I missed something when I copied my code. try changing the . menu-primary part to * ``` @media (min-width: 56.25em){ .menu-primary { display: block; float: none; text-align: center; position: fixed; width: 100%; left: 0; top: 0; padding: 1em 0 0; background: url(http://audio-mg.com/wp-content/uploads/2016/05/5540936-cool-white-backgrounds.jpg); } } ``` * Also, did you mean to change the background color of the page to white? If you will keep it white, then can change the background of the header too.. * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381728) * yeah it works! but the social buttons still looka bit weird…they do not harmonize with the menu. For now I will take them out. Also the “selection-squares” of the header menu look a bit improper. As you can see they seem to overlap the menu bar. If I want to change the colour of the header particualr. Which part of your code do I have to adjust? * Anonymous User 14885823 * (@anonymized-14885823) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381730) * you can change the line.. * `background: url(http://audio-mg.com/wp-content/uploads/2016/05/5540936-cool- white-backgrounds.jpg);` * to anything you want… for example, if you want the background to be white: * `background: white;` * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381731) * great works peferkt! But the square which apperas when you select e.g. portfolio. It overlaps a bit and doesnt look quite good. * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381732) * it would be great if my header could look / animate like this: * [http://www.w3schools.com/cssref/css_colors.asp](http://www.w3schools.com/cssref/css_colors.asp) * Anonymous User 14885823 * (@anonymized-14885823) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381735) * hmmm, can change the menu CSS to * ``` .menu-primary { display: block; float: none; text-align: center; position: fixed; width: 100%; left: 0; top: 0; padding: 1em 0; background: #E8E8E8; z-index: 999; } ``` * in order to add a little space under the buttons in the header.. and also to make it so the header is on top of the image slider (it is going behind it right now). * However, the animating when you scroll down might be a bit difficult.. it’s not just about CSS. * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381737) * great this looks way better thanks!!! * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381788) * Hi again… * when you check my homepage and navigate to “kompetenzen” you´ll see that the colour differs from my menu colour. Could you help me please to change it to the menu colour? * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381792) * I found a better solution…thank you anyways! * Thread Starter [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * (@maggiemalls) * [9 years, 11 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/#post-7381793) * How do I change the font size of my footer? [http://www.audio-mg.com](http://www.audio-mg.com) * Thanks in advance Viewing 15 replies - 1 through 15 (of 18 total) 1 [2](https://wordpress.org/support/topic/chosen-theme-header-alignment/page/2/?output_format=md) [→](https://wordpress.org/support/topic/chosen-theme-header-alignment/page/2/?output_format=md) The topic ‘Chosen Theme – Header alignment’ is closed to new replies. ## Tags * [alignment](https://wordpress.org/support/topic-tag/alignment/) * [header](https://wordpress.org/support/topic-tag/header/) * [menu](https://wordpress.org/support/topic-tag/menu/) * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/) * 18 replies * 2 participants * Last reply from: [maggiemalls](https://wordpress.org/support/users/maggiemalls/) * Last activity: [9 years, 10 months ago](https://wordpress.org/support/topic/chosen-theme-header-alignment/page/2/#post-7381805) * Status: not resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics