1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, 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 Header - Align text at top

Discussion in 'Free Divi Community Forum' started by Baby Studio, Jan 11, 2019.

  1. Baby Studio

    Baby Studio Member

    Hi again,

    I'm working with Fullwidth Header and in "Text vertical alignment" it only shows "Center" and "Bottom". If the module only displays on Phone, this option doesn't appears.

    How can I put the Header Title text and button on top?
    upload_2019-1-11_15-4-54.png

    Those Text and Button are aligned to center, but I want to put the text above.

    Thanks!
     
    #1 Baby Studio, Jan 11, 2019
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    The CSS below will make the bottom alignment to top alignment.

    First, paste the below CSS in Divi > Theme Options > Custom CSS
    Code:
    Log In or Sign Up to view this code.
    Then for your fullwidth header settings, set the Text Vertical Alignment to Bottom.
     
    #2 Divi.Help, Jan 11, 2019
  3. Baby Studio

    Baby Studio Member

    Many Thanks!!
    I did some tests (learning some CSS tips) with your code and it's perfect :)

    Now I'm working in something similar. Fullwidth Header but not using "Design - Layout - Fullscreen" and using the response from the other query:
    https://divi.help/threads/force-module-to-maintains-proportion.1606/#post-4751

    It works ok, my image it always maintains aspect ratio. But when you don't use "Fullscreen", it doesnt' appear "Text Vertical Alignment", so this is the result:
    Captura de pantalla 2019-01-13 a las 13.31.02.png

    This is the source code of the section:

    Code:
    Log In or Sign Up to view this code.
    I think that using again Divi - Theme Options - CSS like

    Code:
    Log In or Sign Up to view this code.
    I will center vertically the text. Does anyone know how I could do it?

    Thanks!
     
    #3 Baby Studio, Jan 13, 2019
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Beautify your Divi archive / category page with 15 different premade blog designs:Learn More
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    #4 Divi.Help, Jan 14, 2019
  5. Baby Studio

    Baby Studio Member

    With this code it doesn't work, but I added a new line and now it works perfect!!
    Code:
    Log In or Sign Up to view this code.
     
    #5 Baby Studio, Jan 14, 2019
    1. PRO MEMBER PERKS Divi Block Pro - Premade logo carousel design for your Divi site without using any plugins:View Demo
  6. Joe Knapton

    Joe Knapton New Member

    I've been trying to achieve the same thing (aligning title text on a full width header to the top of the module), but using the code above only works for me if I justify the text to the left in the layout settings.
    Does anyone know if there's a way for me to centrally align the title and sub-title text at the top of the module?
     

    Attached Files:

    #6 Joe Knapton, Feb 15, 2019
  7. Divi.Help

    Divi.Help Administrator
    Staff Member

    Try to remove the left CSS class. See the below:
    Code:
    Log In or Sign Up to view this code.
     
    #7 Divi.Help, Feb 15, 2019
    1. PRO MEMBER PERKS Divi Block Pro - Premade gradient text design for your Divi site without using any plugins:View Demo
  8. Gareth

    Gareth New Member

    Hi - Thanks for this code, it really helped me out with the same problem. But for me, it doesn't work on mobile. Instead, I get the text aligned in the middle of the screen.

    Am I doing something wrong, or could there be another setting which is affecting this please?
     

    Attached Files:

    #8 Gareth, Aug 7, 2019
  9. Divi.Help

    Divi.Help Administrator
    Staff Member

    Kindly share your URL.
     
    #9 Divi.Help, Aug 7, 2019
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Beautifully crafted Divi layout packs for you to kick start your Divi sites:View Demo
  10. Gareth

    Gareth New Member

    #10 Gareth, Aug 7, 2019
  11. Divi.Help

    Divi.Help Administrator
    Staff Member

    #11 Divi.Help, Aug 7, 2019
    1. PRO MEMBER PERKS Divi Block Pro - Premade before / after image slider for your Divi site without using any plugins:View Demo
  12. Gareth

    Gareth New Member

    Perfect. Thanks very much.
     
    #12 Gareth, Aug 7, 2019
(You must log in or sign up to post here.)