Every logo is unique and has its own shape and size for that reason we need to be able to adjust the height of the logo in the menu bar. Below I will be explaining how you can adjust the height of the Divi logo on desktop and on tablet & mobile devices. For the tablet and mobile we will be using a little bit of CSS. For more tutorials about the Divi logo you can follow this guide.
If you are using a portrait oriented logo than the overlapping logo tecnique can be a great solution for you. For that I recommend to use this tutorial: How to Create a Divi Overlapping Logo
Changing the Divi logo height
For desktop
To change the logo height you go to:
Divi > Theme Customizer > Header & Navigation > Primary Menu Bar
In the logo max height field you can change the logo height. This will adjust the top and bottom space of the logo in the menu bar. If you still want the logo to be bigger than you can change the menu height field in this case the entire menu bar will increase in height.
For tablet and mobile
The above method only works for desktop but you can easily change the logo on tablet and mobile by using this CSS snippet code. Place the following CSS in Divi > Theme Options > CSS
@media (max-width: 980px) {
#logo {
max-height: 80% !important;
}}The max-height percentage is the height of your logo in the menu bar you can change this value to your needs.
If you are using a very wide logo than it can overlap the menu items on smaller screen sizes. If that happens than you can use this fix: Fixing the overlapping menu in Divi