New Landing › How can we help? › Themeforest Theme Support › Dante › Mobile header – menu placement

Viewing 13 posts - 1 through 13 (of 13 total)
  • Back to forum
    Posted in: Dante
  • April 27, 2015 at 6:17 pm #169159
    pbi design
    Member
    Post count: 82

    Hello,

    can you help me fix

    1. the placement of the mobile menu (so it’s in line with the logo)
    and
    2. the overall height of the mobile header (remove all the extra space below the logo)? Although I think the extra space is caused by the menu placement, so it might get resolved once the menu placement is corrected.

    I have attached a screenshot.

    thanks,
    Rossitza

    Attachments:
    You must be logged in to view attached files.
    April 28, 2015 at 2:52 am #169284
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,
    Please use this custom css code:-

    #logo a.mobile-menu-show {
  padding: 23px 0px 0px 8px !important;
}
@media only screen and (max-width: 479px) {
#header-section {
    height: 85px !important;
}
}

    Thanks
    Mohammad

    April 28, 2015 at 5:05 pm #169658
    pbi design
    Member
    Post count: 82

    Hi Mohammad,

    the header height is fine now, but the mobile menu is not. It’s even lower in fact. Here is a screen shot.

    I am wondering it there is other custom CSS that is causing this but I can’t tell.

    thanks,
    Rossitza

    Attachments:
    You must be logged in to view attached files.
    April 28, 2015 at 5:17 pm #169664
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Hi,

    Try this little adjustment 

    #logo a.mobile-menu-show {
  margin-right: -5px!important;
}

    -Rui

    April 28, 2015 at 5:41 pm #169670
    pbi design
    Member
    Post count: 82

    Still not working. Maybe there is something already in the custom CSS messing it up?
    I can send you the WP login if that would help.

    Rossitza

    April 29, 2015 at 1:43 pm #170089
    pbi design
    Member
    Post count: 82

    Hello,

    still waiting to hear back on the mobile menu placement issue. I’ve attached another screen shot – after adding the custom CSS bits both Mohammad and Rui recommended.

    thank you.

    Attachments:
    You must be logged in to view attached files.
    April 29, 2015 at 2:13 pm #170111
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Hi,

    Send us the admin access so we can a look at your css.

    -Rui

    April 29, 2015 at 2:50 pm #170130
    pbi design
    Member
    Post count: 82
    This reply has been marked as private.
    May 1, 2015 at 12:58 am #170684
    Swift Ideas – Ed
    Keymaster
    Post count: 15264

    Add this custom css, that will adjust:

    @media only screen and (max-width: 991px) {
#logo a.mobile-menu-show {
  position: absolute;
  top: 0;
  right: 25px;
}
}

    – Ed

    May 1, 2015 at 1:53 pm #170860
    pbi design
    Member
    Post count: 82

    Thanks Ed,

    that worked perfectly. I now have quite a but of custom CSS you guys have helped me add that’s piling up and I was wondering if it makes sense for it to be grouped together in a particular way? Would you mind taking a look and letting me know your opinion: does it makes any difference or should it be “tidied up”?

    #header-section {
    height: 120px;
    padding: 0px 0;
    }
    .header-6 .container{
    margin-top: -7px!important;
    }
    nav#main-navigation .menu > li > a span.nav-line{
    background-color: #fff;
    }
    nav .menu li {
    letter-spacing: 0.5px;
    }
    .spb_accordion .spb_accordion_section > h3 a {
    font-size: 16px;
    letter-spacing: 0.5px;
    }
    .client-item figure {
    opacity: 1;
    border: none;
    }
    @media only screen and (min-width: 1900px) {
    .alt-bg {
    margin-left: -476px !important;
    padding-left: 490px !important;
    padding-right: 541px !important;
    }
    }
    @media only screen and (min-width: 1900px) {
    .page-heading .heading-text {
    margin-left: 0px;
    }
    }
    @media only screen and (min-width: 1200px) {
    .client-item figure {
    height: 250px;
    }
    }
    .sf-icon-box[class*=”sf-icon-box-boxed-“] .sf-icon-box-content-wrap {
    background-color: #F4F4F4!important;
    }
    @media only screen and (max-width: 767px) {
    #logo img, #logo img.retina {
    max-width: 60%;
    min-height: 0;
    }
    }
    .sf-list {
    padding-left: 1.3em;
    text-indent: -1.6em;
    }
    .spb_tour .tab-content{padding-left:385px;}
    .spb_tour .nav-tabs{width:360px !important
    }
    @media only screen and (max-width: 767px) {
    .spb_parallax_asset.blueheader {
    background-color: #d1d7e3;
    background-image: none!important;
    }
    }
    @media only screen and (max-width: 767px) {
    #header-section {
    height: 85px !important;
    }
    }
    @media only screen and (max-width: 1024px){
    .carousel-wrap a.prev, .carousel-wrap a.next, .flex-direction-nav {
    display: block!important;
    }
    }
    @media only screen and (max-width: 991px) {
    #logo a.mobile-menu-show {
    position: absolute;
    top: 0;
    right: 25px;
    }
    }

    May 1, 2015 at 2:14 pm #170870
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,
    Please use this grouped css code:-

    #header-section {
height: 120px;
padding: 0px 0;
}
.header-6 .container{
margin-top: -7px!important;
}
nav#main-navigation .menu > li > a span.nav-line{
background-color: #fff;
}
nav .menu li {
letter-spacing: 0.5px;
}
.spb_accordion .spb_accordion_section > h3 a {
font-size: 16px;
letter-spacing: 0.5px;
}
.client-item figure {
opacity: 1;
border: none;
}
@media only screen and (min-width: 1900px) {
.alt-bg {
margin-left: -476px !important;
padding-left: 490px !important;
padding-right: 541px !important;
}
}
@media only screen and (min-width: 1900px) {
.page-heading .heading-text {
margin-left: 0px;
}
}
@media only screen and (min-width: 1200px) {
.client-item figure {
height: 250px;
}
}
.sf-icon-box[class*="sf-icon-box-boxed-"] .sf-icon-box-content-wrap {
background-color: #F4F4F4!important;
}

.sf-list {
padding-left: 1.3em;
text-indent: -1.6em;
}
.spb_tour .tab-content{padding-left:385px;}
.spb_tour .nav-tabs{width:360px !important
}
@media only screen and (max-width: 767px) {
.spb_parallax_asset.blueheader {
background-color: #d1d7e3;
background-image: none!important;
}
#header-section {
height: 85px !important;
}
#logo img, #logo img.retina {
max-width: 60%;
min-height: 0;
}
}
@media only screen and (max-width: 1024px){
.carousel-wrap a.prev, .carousel-wrap a.next, .flex-direction-nav {
display: block!important;
}
}
@media only screen and (max-width: 991px) {
#logo a.mobile-menu-show {
position: absolute;
top: 0;
right: 25px;
}
}

    Thanks
    Mohammad

    May 1, 2015 at 2:37 pm #170881
    pbi design
    Member
    Post count: 82

    Thanks Mohammad. I appreciate your help.

    May 1, 2015 at 4:24 pm #170949
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Thanks Mohammad

  • Back to forum
    Posted in: Dante
Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register