Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • July 14, 2015 at 7:10 am #472839
    rmonis86

    Hi my general layout is the boxed layout. While the logo and menu appear normal on my smartphone they are mis-alligned when my site is viewed on a desktop. What is the solution to this? Thanks!

    July 14, 2015 at 8:12 am #472869
    Basilis

    Hi rmonis86!

    Please add the following to your Custom CSS of Theme Options

    .html_header_top.html_header_transparency #header {
  left: 0 !important;
  position: absolute;
}

    Cheers!
    Basilis

    • This reply was modified 9 years, 5 months ago by Basilis.
    July 14, 2015 at 8:26 am #472879
    rmonis86

    Hi thank you for the quick reply but when I place that code the transparency header with the background image goes away and the headed just blends in with the background color. Please check http://www.standpointcapital.com. I wanted to just heave the logo and header be alligned while maintaining the transparency header. Thanks!

    July 14, 2015 at 11:01 am #472975
    Yigit

    Hey!

    Please use following code instead

    @media only screen and (min-width: 767px) {
#header_main .container { padding: 0 !important; }}

    Cheers!
    Yigit

    July 14, 2015 at 4:06 pm #473270
    rmonis86

    Hello thanks for the reply but that did not work. It looks normal when viewed from smartphone or tablet but from a desktop the allignment is still off. The menu is too far to the right that it overlaps my slider and into my background and the logo is in the middle. Please help. Thank you.

    July 14, 2015 at 5:39 pm #473335
    Yigit

    Hi!

    Can you please post a screenshot and show the changes you would like to make so we can make sure that we are on the same page.
    You can upload your screenshots on imgur.com or Dropbox public folder and post the links here

    Regards,
    Yigit

    July 14, 2015 at 7:14 pm #473375
    rmonis86

    Hi here’s the screenshot. As you can see the logo and menu is off to the right. I just want it to look normal.

    July 14, 2015 at 7:15 pm #473377
    rmonis86

    It only looks like that when it is being viewed on a desktop otherwise it is normal on a smartphone or tablet.

    July 14, 2015 at 7:36 pm #473395
    Yigit

    Hey!

    Please add following code to Quick CSS 

    .html_header_top.html_header_transparency #header {
  width: 70%;
}

    Regards,
    Yigit

    July 14, 2015 at 8:12 pm #473414
    rmonis86

    It does not work. When I change the width of the header using that code the logo and menu is now mis-alligned when I use mobile and tablet to view it.

    July 14, 2015 at 9:12 pm #473435
    Basilis

    Hi!

    I have tried my code to debbuger and it works right.
    Can you please provide me backend access to check something?

    Regards,
    Basilis

    July 15, 2015 at 6:58 pm #473921
    rmonis86

    Yes here are the credentials

    July 16, 2015 at 1:54 pm #474285
    Ismael

    Hey!

    You don’t have the latest version of the theme. Please upgrade to version 3.2.2. then update the header options. If possible, please post the header css modifications on pastebin.com so that we can check it.

    Cheers!
    Ismael

    July 16, 2015 at 4:21 pm #474413
    rmonis86

    OK I updated the theme and it still didn’t fix the problem. Here is my css code. When I put that header code I have to change it to 62% from 70% to look normal on my desktop. At 62% or 70% when I put that code the headers and look are misaligned when I use my mobile or tablet.

    July 20, 2015 at 12:47 pm #475741
    Andy

    Hi!

    not sure which look you are trying to achieve. You said “I just want it to look normal”. Can you show us using screenshots how that would look like for you? because then we are able to provide you some precise CSS code for mobile and desktop version. Right now your website (header, menu, etc) look so different to me than on your previous screenshot.

    Cheers!
    Andy

    July 20, 2015 at 6:59 pm #476028
    rmonis86

    I want it to look like this http://i.imgur.com/Fbu80Og.jpg on all platforms; desktop, mobile, and tablet, but right now it looks like this only on the desktop and it looks like this http://i.imgur.com/T8WBgee.jpg on mobile and tablet right now. This is what I consider a normal menu http://i.imgur.com/Fbu80Og.jpg and this is not http://i.imgur.com/T8WBgee.jpg. Please help me to make it look normal on all platforms of viewing the website.

    July 21, 2015 at 1:14 pm #476458
    Andy

    Hey!

    thanks for the screenshots.

    Use this code for your menu on desktop: 

    nav.main_menu {
right: -225px;
}

    and add this for mobile:

    @media only screen and (max-device-width: 736px) {
.avia-menu.av-main-nav-wrap {
width: 140%;
right: -225px;
}}

    Best regards,
    Andy

    July 21, 2015 at 5:39 pm #476645
    rmonis86

    That worked! Thank you so much!!!

    July 22, 2015 at 5:49 am #476858
    Rikard

    Hey!

    Great, glad we could help :-)

    Cheers!
    Rikard

  • Author
    Posts
Viewing 19 posts - 1 through 19 (of 19 total)
  • The topic ‘Boxed Layout Header Allignment’ is closed to new replies.