Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • March 16, 2017 at 1:32 pm #761879
    romainp841

    Hi Kriesi team ! :)

    I want to add a special header on the “Atelier” page because the background is too dark and the menu text illegible.

    So I tried several combinations, I lost time and maybe my mind :D

    Anyway, the best combination I found is :

    1) No transparency header on the page
    2) Add Quick CSS : 

    .header_color .header_bg {
background-color: rgba(255, 255, 255, 0.6);
}

    (the top image on imgur)

    The header was transparent but not fixed on the Full screen Slider, so I added this code to fix the header on the full screen slider :

    #main {
    padding-top: 0 !important;
}

    (Bottom image on imgur)

    The header is like I want, perfect ! But there is a gap under the slider (white space) who isn’t full screen anymore…

    Please help me !

    Thanks in advance.
    Romainp841.

    • This topic was modified 7 years, 8 months ago by romainp841.
    March 17, 2017 at 7:18 am #762363
    Rikard

    Hey romainp841,

    The slider looks fine on my end in Chrome, there is no space under it. If you are still having problems then maybe you could use a Color Section element instead and set the image as a background to it?

    Best regards,
    Rikard

    March 17, 2017 at 12:54 pm #762446
    romainp841

    Hi Rikard,

    I looked at the website on different computer and web browser (Mac book, IMac, laptop windows, etc…) and the space is still there…

    I tried with the Color Section several times and it’s exactly the same with the 100% height (full screen option), I have a small space too.

    So I tried with the height custom option. I set up 700px (the height dimension of my screen laptop) and it’s working. But if I look on the Mac Book there is a space again because the height dimension is 800px, and the IMac 1***px, etc…

    On the top, Full Slider height = height of the screen – height of the header (for me it’s 780px – 70px = 710px)

    When I add this code : #main {
    padding-top: 0 !important;
    }

    The Full Slider goes under the header but stay with 710px of height, so I have a 70px of space…

    • This reply was modified 7 years, 8 months ago by romainp841.
    March 22, 2017 at 7:41 am #764628
    Ismael

    Hi,

    It’s normal because the top padding is not included in the section’s height calculation. If you want to fix this, you need to modify the js > shortcodes.js file, look for this code around line 2326:

    	wh100_mod 	= wh100,

    .. add the top padding value in px:

    	wh100_mod 	= wh100 + 83,

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.