How to divide header in wallpress?

Good morning
I downloaded the free version of wallpress and thank you for the very beautiful template. This section “questions and answers” really helped me. All though, I have two problems I can not solve and I need your help.
1) I want to put a bigger logo, i just read here how i can do that, but because it is wide, at the same time the width of header grows too, making it the width of the menu too big and hide the first lines of the Post. Is there a way to divide the header two pieces to customize the width of logo and the width of menu as I want?
2) I use the normal grid post, but is not compatible with the mobile phone, it seems half the screen. Looks good at mobile only when using double grid posts. Is there a way to make it fully compatible whith the normal grid?
thank you
🙂

2 Answers

DominicStaff
answered 10 years ago

Apologies for the delay in replying to you.
1. To add a big logo to the Wallpress theme, you can add the following code to the Header code (Dashboard > Customize > Custom Code).

 <style>
#branding h1 { height: 90px; width: 230px; }
#header #navigation li a { height: 90px; line-height: 90px; }
#main { padding-top: 100px; }
</style>

2. Please send me your site for further checking.
Regards,

Christie Kyriakaki
replied 10 years ago

Thank you for the reply,

I changed the size of logo as advised but the menu is very wide now.
Is there a way to cut down the width of the menu without changing the size of the logo?
Here is my site:
http://www.nomorediet.gr/

DominicStaff
answered 10 years ago

To resolve this issue, you can replace the older code that you have added to the Header code with new code:

<style>
#site-title img {margin-top: 6px;  max-width: 50%; }
#branding h1 { height: 77px; width: 130px; }
#header #navigation li a { height: 77px; line-height: 77px; }
</style>

Hope this helps !

Christie Kyriakaki
replied 10 years ago

Thank you! is ok now!

:))))