Okay
  Public Ticket #2874731
Issue with mobile view
Closed

Comments

  • Mayfish started the conversation

    I've recently put a site together. 

    The only glitch is when in Responsive Design, the 2 smallest screen sizes generate several screens worth of home page to the right, with a scroll bar to aid in looking at a blank page. It also does this ITRW on my mobile too. 

    Move up a screen size in RDesign and it's fine. 

    I've scowered the layers as I thought there may be an attribute hiding there somewhere, but no. 

    Any ideas folks. 

    I'm using Twenty twenty one and Theme Kit for Twenty Twenty One

    Thanks 

    Paul May 


  •  344
    David replied

    Hey there, please find these and remove them

    2881310815.png
    9954120492.png

    And add this rule

    header#masthead {
        overflow: hidden;
    }


    Let me know if that has worked for you!



    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • Mayfish replied

    Hi David,


    Thanks for looking.

    Sorry about this, but can you clarify exactly what bits I'm deleting? Is it all from and including @med.....    ......important: }

    Or just one line or section.

    As I am sure you'll appreciate I don't want to get this wrong.

    Thanks

    Paul

  •  344
    David replied

    Hi, no so you have to delete

    #page #main p { .... }

    #main .hentry .entry-content {....}

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • Mayfish replied

    Hi David,
    As much as I try, I just cannot find the "margin-top:-48px" that is in the source below, in any CSS files. The text below has been grabbed from the staging.henry-may.com website.
    I'm wanting to change the - 48 to 4, but as I say I can't find the right file. I've been at this all day.
    This changes where the 'close' button is when the burger menu is used. ATM it sits above the screen, hence wanting the margin changing.
    Any help anyone can offer would be appreciated
    Paul


    The following  css codes are created by the yellow pencil plugin 

    #masthead .site-logo img{min-width:150px;min-height:150px;}#primary{border-bottom-style:solid;border-bottom-width:2px;border-top-width:2px;}#content{border-style:none;}.site-branding .site-title a{font-weight:700;font-size:50px;}#main{padding-top:0px;padding-bottom:14px;}#page{-webkit-transform:translatex(11px) translatey(-65px);-ms-transform:translatex(11px) translatey(-65px);transform:translatex(11px) translatey(-65px);height:4200px;padding-bottom:1px;padding-top:68px;}#colophon{padding-bottom:0px;-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);display:inline-block;height:0px;}#page .widget-area{padding-top:0px;padding-bottom:2px;min-height:293px;}#colophon .site-info{padding-top:7px;margin-bottom:0px;margin-top:3px;position:relative;bottom:21px;}#colophon nav{position:relative;bottom:25px;}@media (max-width:1504px){.site-branding .site-title a{font-weight:700;font-size:50px;width:9px;}#masthead .site-branding .site-title{width:417px !important;}#masthead{position:relative !important;padding-top:0px;}#content{padding-top:0px;}}@media (max-width:1036px){.site-branding .site-title a{font-size:50px;font-weight:600;}#masthead .site-branding .site-title{font-size:50px;}#content{padding-top:0px;}}@media (max-width:1023px){#masthead{position:static;}#masthead .site-branding .site-title{font-size:50px;}#masthead .site-branding .site-description{font-weight:600;font-size:30px;}.site-branding .site-title a{font-weight:700;}#masthead .site-branding h1{font-weight:700;}#page .widget-area{border-top-width:3px;}#content{border-bottom-style:solid;border-bottom-width:2px;padding-top:0px;}#page{-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);}}@media (max-width:821px){#masthead{position:static;}.site-branding .site-title a{font-weight:700;}#content{padding-top:0px;}}@media (max-width:781px){#masthead{position:static;}.site-branding .site-title a{font-weight:700;}#content{padding-top:0px;}}@media (max-width:768px){#masthead{position:static;}.site-branding .site-title a{font-weight:700;}#content{padding-top:0px;}}@media (max-width:651px){#masthead{position:static;}.site-branding .site-title a{font-weight:700;}#content{padding-top:0px;}}@media (max-width:599px){#masthead{position:static;}.site-branding .site-title a{font-size:50px;font-weight:700;}#content{padding-top:0px;}}@media (max-width:481px){#masthead{position:static;-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);}.site-branding .site-title a{font-size:45px;font-weight:700;}#masthead .site-branding .site-description{font-size:25px;}#site-navigation{-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);}#site-navigation .menu-button-container{padding-top:0px !important;margin-top:-48px;}#primary-mobile-menu{font-size:35px !important;color:#653024 !important;font-weight:500;position:relative;top:107px;}#masthead .site-branding h1{letter-spacing:-0.7px;font-weight:400;-webkit-transform:translatex(11px) translatey(-65px);-ms-transform:translatex(11px) translatey(-65px);transform:translatex(11px) translatey(-65px);}body{position:relative;top:-1px;}#page{-webkit-transform:translatex(11px) translatey(-65px) !important;-ms-transform:translatex(11px) translatey(-65px) !important;transform:translatex(11px) translatey(-65px) !important;}#page #masthead .site-branding h1{width:334px !important;}}@media (max-width:383px){#page #masthead .site-branding h1{width:310px !important;}#page{-webkit-transform:translatex(11px) translatey(-65px);-ms-transform:translatex(11px) translatey(-65px);transform:translatex(11px) translatey(-65px);}#masthead .site-logo{-webkit-transform:translatex(11px) translatey(-65px);-ms-transform:translatex(11px) translatey(-65px);transform:translatex(11px) translatey(-65px);position:relative;top:62px;padding-bottom:46px;margin-bottom:44px;left:-16px;}#masthead .site-branding{height:231px;}#masthead .site-logo span{top:8px;}#page #main p{width:334% !important;}#main .hentry .entry-content{width:375px;}#content #main .wp-block-column p{width:334px !important;}}@media (min-width:384px){#site-navigation{-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);}#masthead .site-branding .site-title{width:344px !important;padding-right:0px;}#masthead{-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);width:95%;}#main{width:96%;margin-left:7px;}#page .widget-area{width:95%;}#colophon{width:95%;}#primary-mobile-menu{top:128px;}}@media (min-width:482px){#masthead .site-logo img{max-height:300px;}#masthead{padding-bottom:0px;}}@media (min-width:652px){#content{padding-top:0px;}#page .widget-area{margin-top:4px;}}@media (min-width:822px){#masthead{padding-top:0px;}}@media (min-width:1220px){#masthead{position:static;}}.hentry .entry-header h1{width:783px;-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);max-width:832px;min-width:0px;margin-right:197px;margin-left:273px;}#main .hentry header{-webkit-transform:translatex(0px) translatey(0px);-ms-transform:translatex(0px) translatey(0px);transform:translatex(0px) translatey(0px);}@media (max-width:1036px){.hentry .entry-header h1{margin-left:192px;}}@media (max-width:821px){.hentry .entry-header h1{margin-left:100px;}}@media (max-width:781px){.hentry .entry-header h1{margin-left:82px;}}@media (max-width:651px){.hentry .entry-header h1{margin-left:33px;}}@media (max-width:481px){.hentry .entry-header h1{margin-left:17px;}}@keyframes DarkModeToggler_Animate_58{0% {-webkit-transform:none;-ms-transform:none;transform:none;-webkit-transform:none;}50% {-webkit-transform:translatex(101px) translatey(-10px);-webkit-transform:translatex(101px) translatey(-10px);-ms-transform:translatex(101px) translatey(-10px);transform:translatex(101px) translatey(-10px);}100% {-webkit-transform:translatex(101px) translatey(-10px);-webkit-transform:translatex(101px) translatey(-10px);-ms-transform:translatex(101px) translatey(-10px);transform:translatex(101px) translatey(-10px);}}@-webkit-keyframes DarkModeToggler_Animate_58{0% {-webkit-transform:none;-ms-transform:none;transform:none;-webkit-transform:none;}50% {-webkit-transform:translatex(101px) translatey(-10px);-webkit-transform:translatex(101px) translatey(-10px);-ms-transform:translatex(101px) translatey(-10px);transform:translatex(101px) translatey(-10px);}100% {-webkit-transform:translatex(101px) translatey(-10px);-webkit-transform:translatex(101px) translatey(-10px);-ms-transform:translatex(101px) translatey(-10px);transform:translatex(101px) translatey(-10px);}}
    </style></head>

  • Mayfish replied

    Hi, I did today find the errant code......

    Thanks for your help with all the advice.

    Paul

  •  344
    David replied

    Hi,

    Glad that worked :)  I’ll be closing this Ticket. Feel free to open a New ticket in case something else comes up. If you like my support, so please rate Me and My support on CodeCanyon site where you bought our theme that would be highly appreciated. Just sign in with your credentials on CodeCanyon and you will be able to give rating for our Theme https://codecanyon.net/downloads

    2980707987.png

    I would like to thank you in advance for taking your precious time to rate our plugin on CodeCanyon.



    Best Regards, WaspThemes

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!