1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Fullwidth video background problem

Discussion in 'Free Divi Community Forum' started by Fulltimealchemist, Jun 7, 2020.

  1. Fulltimealchemist

    Fulltimealchemist New Member

    Hi,
    My background video is not adapted to the computer screen, I made a 1900/900 video so it should fit perfectly but it's cropped... can you please help I'm desperate :( 000000000000.PNG 1111111111.PNG sdshfgq.PNG
     
    #1 Fulltimealchemist, Jun 7, 2020
    1. PRO MEMBER PERKS Divi.Help Layout AI Generator - Try the power of AI to generate a custom Divi layout for you:Try Now
  2. Fulltimealchemist

    Fulltimealchemist New Member

    #2 Fulltimealchemist, Jun 8, 2020
  3. Divi.Help

    Divi.Help Administrator
    Staff Member

    This is because the section height is fixed & the video size is smaller on smaller screen. That's why it will be cropped on smaller screen.

    Try the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
    **Tried to use 0 height & % padding to make the section height to be smaller on smaller screen, so that it will fit the size of the video.
     
    #3 Divi.Help, Jun 8, 2020
    1. PRO MEMBER PERKS Divi Block Pro - Premade testimonial carousel design for your Divi site without using any plugins:View Demo
  4. Fulltimealchemist

    Fulltimealchemist New Member

    Thank you, it almost did the trick, how can I have the entire video displayed, I still have a small bottom part missing ?

    Also, how can I have mthe underneath pictures correctly sized on mobile phone ?

    Clapture.PNG
     
    #4 Fulltimealchemist, Jun 8, 2020
  5. Divi.Help

    Divi.Help Administrator
    Staff Member

    Tweak the value a bit:
    Code:
    Log In or Sign Up to view this code.
    As for the section below, it's placed incorrectly in mobile due to the Row Settings > Margin Left. Just go to the Row Settings & set the margin left for mobile / tablet to be 0.
     
    #5 Divi.Help, Jun 8, 2020
    1. PRO MEMBER PERKS Divi Block Pro - Premade before / after image slider for your Divi site without using any plugins:View Demo
  6. Fulltimealchemist

    Fulltimealchemist New Member

    THANK YOU !!!
     
    #6 Fulltimealchemist, Jun 8, 2020
  7. LLukash

    LLukash New Member

    The code you are sharing works just perfect for video on desktop version but I also have another video clip for mobile with different size and unfortunately the code crashes it. Any idea how to set your code for desktop only so mobile version clip stays unchanged?
     
    #7 LLukash, Dec 18, 2023
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Industrial' Divi layout for all Pro members:View Demo
  8. Divi.Help

    Divi.Help Administrator
    Staff Member

    Just wrap the CSS with the below:

    @Media screen and (min-width: 981px) {

    }
     
    #8 Divi.Help, Dec 26, 2023
(You must log in or sign up to post here.)