Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

Problem with resposive in mobile and tablet.

    • 9 years, 7 months ago inkout
      Participant

      Expired

      Hi

      I have look the site in mobile and i have seen that the view for resposive mode have some bugs….

      I can send you my credentials… so you can look well the problem.

      I have try to close the window on my computer, but i can see different problem of view: in the computer i have problem with the box (is not correct responsive), but in mobile the logo is out of windows and the brands carousel doesn’t work….

      Look the screenshot about pc

      https://www.dropbox.com/s/ho816egec3yj4mi/screen1.png?dl=0

       

      https://www.dropbox.com/s/qrmikigk83xpng3/screen2.png?dl=0

       

      i’ll wait for your soon answer.

      best regards

    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      Sorry for the late reply.
      Please add this code into your custom css box:

      @media (max-width: 480px){
        #logo {left: -90px !important;}
        .mobile_small_menu { left: 35px;}
        #cookie-law-info-bar { width: 75%;}
      .clients .item { width: 200px !important;}
      }

      Result.

      @media (min-width: 768px){
      .vc_col-sm-4 { width: 30%;}
      .vc_col-sm-12 {
          width: 93%;
          left: 23px;
      }
      .vc_col-sm-6 {
          width: 45%;
          left: 24px;
      }
      .clients .item a img {width: 73% !important;}
      .vc_responsive .full-width-content.wpb_row .vc_col-sm-12 {padding-right: 40px;}
      .header_tools .extra_navigation_button { padding-right: 38px;}
      }

      Result.
      Let us know.

      Best regards!

    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      Please send me your wp credentials in a private reply. So we can fix it for you.

      Best regards!

    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      Sorry for the late reply.
      -There are some css files that do not let this code take effect. Please go to file css/bootstrap-responsive.css and find these lines(1347):

      #logo{float:right;left:0 !important; right:0 !important; -webkit-transform: none !important;
           -moz-transform: none !important;
            -ms-transform: none !important;
             -o-transform: none !important;
                transform: none !important;
        }

      edit to this:

      #logo{float:right;left:0; right:0 !important; -webkit-transform: none !important;
           -moz-transform: none !important;
            -ms-transform: none !important;
             -o-transform: none !important;
                transform: none !important;
        }

      -Then in the same file find this code(1383):

      .clients .item{
          width:250px !important;
        }

      Edit to this:

      .clients .item{
          width:250px;
        }

      I made some minor changes to the css code in your custom css box, too. With these it should be ok.
      Let us know.

      Best regards!

    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      As i wrote you above, i only edited a little the css code in your custom css box. That does not affect other configurations. The other suggested edits in bootstrap-responsive.css also do not affect the site.
      Undo the changes to bootstrap-responsive file(or just overwrite it with a new copy).
      Send us your ftp credentials as well, so we can give it a look.

      Best regards!

    • 9 years, 7 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      I fixed it.
      I added this code into your custom css box:

      .top_wrapper {  width: 100% !important;}
      @media (max-width: 480px){
      .wpb_revslider_element.wpb_content_element {
          padding-left: 0 !important;}
      }
      @media (min-width: 768px){
      .wpb_revslider_element.wpb_content_element {
          padding-left: 0 !important;}
      }

      I double checked the responsive too. It is ok too.

      Best regards!

      • This reply was modified 9 years, 7 months ago by Mirela.
    • 9 years, 7 months ago inkout
      Participant

      Expired

      Ok! the responsive seems work well.

      But the slide in the homepage has always a bad work , there is a white space in both side, whereas before it was flush with the box.

      You can fix also this please.

      Thanks again

      R.

    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      You have set it as a normal element, that is why the slider is taking the alignment of normal elements in boxed layout. Increase sliders width or consider adding slider from Page’s General Options > Slider. I have set up a test page. As you can see, the slider is at it’s place here.

      Best regards!

    • 9 years, 5 months ago inkout
      Participant

      Expired

      I’m sorry, but after your change about codes the homepage is  strange:

      1. the slides do not line up on the edge as it was earlier and as it is in the demo, but exist  white margins

      2. logos are much smaller now and everything looks aligned left

      3. margins seem excessive in relation to the demo and left maggiorne than right across the page

      https://codeless.co/specular/business3/

      4. even footer is quite changed

      anyway if you compare the demo with my current home I have many differences of impagination, whereas before it was perfect, I do not understand, have I to recreate it all over again?
      Best Regards
      R

    • 9 years, 5 months ago inkout
      Participant

      Expired

      also if I decrease the window (responsive mode) I have new problems with the Alignment menù ….
      it seems that the problems have multiplied rather than resolved …

       

      https://www.dropbox.com/s/b55kad2cerz8bxl/problem.png?dl=0

       

      Best regards

    • 9 years, 5 months ago inkout
      Participant

      Expired

      Please,
      I have writen one month ago… and i haven’t solved the problem yet.
      Please can you give me a final solutions  about it? <span id=”result_box” class=”” lang=”en”> <span class=”hps”>I</span> <span class=”hps”>really</span> <span class=”hps”>urgent…</span></span>
      thanks again.
      R.

    • 9 years, 5 months ago inkout
      Participant

      Expired

      Please,

      can I have an answer to those problems…

      Best Regards

      R.

    • 9 years, 5 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 5 months ago Mirela
      Participant

      Hello,

      Sorry for th elate reply.
      Please keep in mind that we respond to topics according to their arrival time. The oldest first. So keeping replying to your own topic often will only delay our respond time.

      1-Your site is not identical to the demo because it has other data in it. Starting from the logo which is in different dimensions from the demo.
      The code added to your custom css box, was shaping the responsive layout of the site. It does not affect other configurations whatsoever.
      A newly installed plugin can affect the site, or an updated plugin..etc.

      2-As for the menu in this view, this happens when the menu width exceeds the header width (some points while re-sizing the window) This is resolved by changing the css for that specific screen width. However you should know that the responsive code covers the predefined screen-width of mobiles/tablets (read more here). These resolutions are fixed and the same for all devices.

      3-We are sorry that this topic from a month ago is still open, but removing the code we give you, won’t help moving forward with it. We test the code we give you, so the other changes you have been experiencing are not related to this.

      4-Please add these lines into your custom css box, for the layout of width 800px and 850px:

      @media (max-width: 979px) and (min-width: 768px){
      .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container, .header_7.header_wrapper .container { width: 667px !important;}
      .services_small.wpb_content_element.align_left {  margin-left: -44px !important;}
      }
      @media (min-width: 768px){
      .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container, .header_7.header_wrapper .container { width: 697px !important;}
      .vc_col-sm-4 {  width: 30% !important;}
      }
      @media (min-width: 980px){
      nav .menu > li > a {
          margin-left: -5px !important;
          margin-right: -5px !important;
      }}

      Let us know.

      Best regards!

    • 9 years, 5 months ago inkout
      Participant

      Expired

      Good morning, I am following your advice to the letter, but unfortunately also this time not working.
      Attach screen to see how the site is amended by adding the css custom.

      https://www.dropbox.com/s/lohrpv7h5rgffb6/CustomCss.png?dl=0
      I believe that the margin was excessive on both sides

      as far as the menu I can try to solve decreasing the title …
      but for the responsive mode it is still a problem that the content comes out of the box in some resolutions …..
      see example

      https://www.dropbox.com/s/up5c5iqrwhvecqi/Responsive.png?dl=0

      I’m waiting a soon answer
      Best Regards

    • 9 years, 5 months ago inkout
      Participant

      Expired

      Hi! i’m waiting for an answer…..
      i know that you respond to older topics first, but i had written a week ago….
      i had seen that exists a new release about theme,  had you fix the problem about responsive?

      Best regards

      R.

    • 9 years, 5 months ago Ruco
      Keymaster

      Hello,

      Sorry for the late response. I see you have solved the menu item margin issue. To change them please go to Spsecular -> Header Options -> Menu Options.

      I fixed this issues on ipad. https://www.clipular.com/c/6485821046128640.png?k=MJn1Y3kAi5cWvIht9HR7qbbHciE

      Let us know if you need further help.

      Please update the theme, you have an old theme version, also you must update visual composer.

      How to update theme

      Update visual composer

      best regards!

    • 9 years, 5 months ago inkout
      Participant

      Expired

      Good Morning,
      I have see ther you had fix the problem in tablet but:

      1. in the mobile version of the logo disappears

      2. in the desktop version no longer exist the side margins and all texts stuck on the edge … thing in your demo and in my original version was OK.

      can you fix this problem….
      i’d like have the original vwrsion but with mobile and tablet versions working

       

      best Regards

    • 9 years, 5 months ago inkout
      Participant

      Expired

      you can see the screenshot

      https://www.dropbox.com/s/41mvp6189zzvr4c/problem_2.zip?dl=0

       

      Thanks

      R.

    • 9 years, 5 months ago Mirela
      Participant

      Hello,

      1-I added this code into you custom css box:

      @media (max-width: 480px){
      #logo { float: none !important;}
      }

      2-I added this code:

      @media (min-width: 768px){
          .vc_col-sm-12 { padding-left: 30px !important;
          padding-right: 30px !important;}
          .vc_col-sm-6 { padding-left: 30px !important;
          padding-right: 30px !important;}
          .vc_col-sm-4 { width: 33% !important;}
      }

      Result. Please check your site.

      Best regards!

    • 9 years, 4 months ago inkout
      Participant

      Expired

      I’m sorry…

      but your last code

      @media (min-width: 768px){
          .vc_col-sm-12 { padding-left: 30px !important;
          padding-right: 30px !important;}
          .vc_col-sm-6 { padding-left: 30px !important;
          padding-right: 30px !important;}
          .vc_col-sm-4 { width: 33% !important;}
      }
      
      now the slider in home isn't fullwidh!
      
      I can not understand how we can not fix the problem about responsive mode without constantly break the layout of the homepage that was always OK!
      and now every time you add a new css this goof up,
      it is possible to obtain the correct homepage ??? with slide full-page and the margin set correctly in the lower modules ??
      the responsive part has a bug, can you fix it without worsen things? also because I have still 13 days of support and after months of dialogue  I risk to not having solved the problem,. It is not very professional
      answer me soon Please
      R.
    • 9 years, 4 months ago inkout
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 4 months ago Mirela
      Participant
      This reply has been marked as private.
Viewing 29 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password