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

Background Images shifting on mobile

background imagebackground videocenteredMobilemovinguncentered
    • 7 years, 11 months ago tfussell1
      Participant

      Expired

      Hi There,

      I have two rows with background imagery on my site vchainanalytics.com. One with a video and another with a parallax image. They are both set to center/center and look great on the desktop. However on mobile, they are no longer centered and appear to be left justified. How can I correct this?

      Thanks!

      Tye

    • 7 years, 11 months ago Mirela
      Participant

      Hello,

      I don’t see any issue with the video (screenshot), however to reset background position to center/center, please add this code into your custom css box:

      @media (max-width: 480px){
      .wpb_row.section-style, .wpb_row.standard_section {
          background-position: center center !important;
      }}

      Result screenshot: https://postimg.org/image/vsah7ere3/
      Let us know.

      Best regards!

    • 7 years, 11 months ago tfussell1
      Participant

      Expired

      Hi, Thanks for this code, but it didn’t have any effect. Your screen shot looks great, see mine I took after adding the css:

      https://postimg.org/image/mdi4lbnxl/

      https://postimg.org/image/thzxucv6x

    • 7 years, 11 months ago Mirela
      Participant

      Hello,

      Please edit the code above to this:

      @media (max-width: 480px){
      .wpb_row.section-style, .wpb_row.standard_section {
          background-position: center center !important;
      }
      .video_section #video_background {
          left: -355px !important;
      }
      .vc_custom_1496266009264 {
          background-color: rgba(255, 255, 255, 0.52) !important;
      }}

      This should be the result for the video: https://postimg.org/image/4lwv7vy7t/
      For the image alignment, you need to make a change to css/bootstrap-responsive.css file first. Find these lines(1669):

       .section-style.parallax_section{
          background-position:0 0 !important;
          background-attachment:scroll !important;
        }

      Remove or comment out background position line. Example: /* background-position:0 0 !important; */
      If you still can’t get the same effect, then please send us some valid wp credentials in a private reply. So we can do it for you.

      Best regards!

    • 7 years, 11 months ago tfussell1
      Participant

      Expired

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

      Hello,

      I logged in and checked the code. I edited it out but you need to make the changes to the css/bootstrap-responsive.css file as advised in my last reply. That file is not listed in the Appearance > Editor list of files so i can not make these changes via wordpress.

      Just go to your cpanel > file manager > public_html > wp-content > themes > tower > css > bootstrap-responsive.css.
      Find lines 1669, here you have the block of code i send you in the last reply. Comment out the recommended line and save. That’s it. Clear cache and refresh page.
      Let us know.

      Best regards!

    • 7 years, 11 months ago tfussell1
      Participant

      Expired

      This did the trick! Thank you, thank you, thank you!

Viewing 6 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