Reduce width of logo area and expand with of inline menu

Hi, Kharis,

On Desktop version, I need less width for the inline Logo and more width for the Menu…a 20% to 80% ratio would be ideal, but I cannot figure out how to achieve this! At one point I did get some code to work, but it made the logo very tiny in all of the mobile applications.

Webpage is: test.hillyerlang.com/codel/

Thank you in advance for your response!

Hillyer

Hello Hillyer,

I am looking into it. I will update you ASAP. Please be patient.

Regards,
Kharis

Hello Hillyer,

It seems like you have been able to manage them correctly. Please let us know if you still need an assistance.

Regards,
Kharis

Hello, Kharis,

Actually, I have not been able to get the width of the logo to be about 20% and the navigation to be about 80% in width…they are currently the theme default of about 33% and 66%.

Can you help me with some code that will change the widths to 20% and 80% without causing the different media results to be less than the 100% they are now?

Thank you so much for your help!

Hillyer

Dear Hillyer,

Could you try to apply the following CSS code?

@media only screen and (min-width: 1025px){
  
  .header-wrap .col-md-4{
    width: 20%;
  }

  .header-wrap .col-md-8{
    width: 80%;
  }  
  
}

Let me know how it goes.

Regards,
Kharis

Hi, Kharis,

I put in the code you sent and nothing happened to the width of either the logo area or the nav area. Mobile applications stayed the same as well.

In Firefox developer tools I took a screenshot of the div surrounding the logo (showing size of 227.273 x 45.4546) and got this value:

div.col-md-4.col-sm-8.col-xs-12 = 354.545 x 45.4546

and a screenshot of the div surrounding the navigation and got this value:

div.col-md-8.col-sm-4.col-xs-12 = 709.09 x 52.7273

These values stayed the same, before and after entering the code. I cleared caches in both Firefox and Chrome, and reloaded the code, even changing it from 20%x80% to 25%x75%, thinking that the logo might be too large to accept the 20%, but am still seeing no result.

Is this additional information helpful? Is there anything else I can do to help fix this problem? You can see that I have too many menu items for the space allowed.

Thank you, Hillyer

Hello, Kharis,

I tried the code you gave me, but it did not work:

@media only screen and (min-width: 1025px){
.header-wrap .col-md-4{
width: 20%;
}
.header-wrap .col-md-8{
width: 80%;
}
}

In my Firefox developer tools I can change the dimensions for .col-md-4 and .col-md-8 and see the desired result. However, when I put the code in the Theme css, absolutely nothing happens. Do I need to go to the Pro version of Sydney?

Your help is appreciated!

Hillyer

Dear Hillyer,

Thank you for updating me.

Could you please try to apply the following?

@media only screen and (min-width: 1025px){
  
  .header-wrap .col-md-4{
    width: 20% !important;
  }

  .header-wrap .col-md-8{
    width: 80% !important;
  }  
  
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Regards,
Kharis

Hi, Kharis,

Subject: Slider not centering in Internet Explorer 11

I have another issue. I have used the Crelly slider (as well as the Huge IT Slider) and my client sent a screenshot of the issue he sees on his Asus 24" monitor using Internet Explorer 11. I have read up on issues with IE and have tried several options, but cannot seem to make this work for him. The slider is not centering…I have a screenshot if you would like for me to send. Please help!

Access information:

Test site: test.hillyerlang.com/auto/
WP Login: test.hillyerlang.com/auto/wp-admin/

Home and Home2 use Huge IT Slider, Home3 uses Crelly

This issue is so frustrating! Thank you in advance so much for your help!

Hillyer

Dear Hillyer,

Please share a screenshot here. You would upload it to the free file hosting service like Dropbox or Google Drive and share its link here.

Regards,
Kharis