Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • September 21, 2018 at 6:14 pm #1012853
    Noepineau

    Hi all!
    Trying to make a 50 px hight color section.with a text massage in.
    If I “Save Draft” and look at the “Preview” the color section is OK: 50 px hight
    If I “Publish” and “Update” and look at the “web page” the color section is NOT OK: 100 px hight
    (I must confess: it is working with the “Slimbrowser from Flash Peak” not working with all others: Firefox, Chrome…)

    What I have done:
    – assign the color section an ID: my_section
    – did assign a 40 px height and a color background: #efbb20

    – Placed a “code block” into this color section:
    <p> This is my message… </p>

    Wrote a quick CSS into the child theme:
    #my_section{
    height: 50px ;
    min-height: 50px;
    }

    What I have done wrong?
    Thank you
    Noemi.

    September 22, 2018 at 5:36 am #1012994
    Rikard

    Hey Noemi,

    I couldn’t find that ID on the page you linked to, is it the zenmiddle section you want to apply this to? If so then please try this CSS instead:

    #zenmiddle {
  min-height:50px !important;
}

    Best regards,
    Rikard

    September 22, 2018 at 9:50 am #1013015
    Noepineau

    Hey Rikard,
    Thanks very much for your help.
    Sorry about that: I was’nt accurate enought:: this was my CSS:
    div#zenmiddle {
    height: 40px;
    min-height: 40px;
    }
    I did replaced it by your CSS instead:
    #zenmiddle {
    min-height:50px !important;
    }
    Unfortunatly does’nt work. Cannot figure out why
    Best regards,
    Noemi.

    September 22, 2018 at 11:10 am #1013032
    Rikard

    Hi,

    Thanks for the feedback. I can’t see your CSS applying at all, where exactly are you placing it? Please try it in Quick CSS, then regenerate the files under Enfold->Performance as well, or just deactivate everything there until you are done with your edits.

    Best regards,
    Rikard

    September 22, 2018 at 11:49 am #1013036
    Noepineau

    Hi Rikard,
    >I can’t see your CSS applying at all, where exactly are you placing it?
    >Please try it in Quick CSS,
    It was in the Quick CSS allright

    >then regenerate the files under Enfold->Performance as well,
    >or just deactivate everything there until you are done with your edits.

    I did that… It did worked perfectly!

    I’m quite impressed.

    Thanks so much Rikard!
    Noemi.

    September 22, 2018 at 12:58 pm #1013045
    Rikard

    Hi Noemi,

    Great, glad you got it working :-)

    Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    September 22, 2018 at 3:44 pm #1013084
    Noepineau

    Hi Rikard,

    Thanks for your help. You can close the topic now.

    In summary:
    * The Enfold->Performance setting of the CSS file merging and compression IS DECISIVE :
    – Disable – no CSS file merging and compression –> OK: Color section is 50 px hight
    – Enable – merge and compress all theme CSS files –> NOT OK: Color section is 100 px hight

    * About CSS syntax: those both syntax are working (only if CSS file merging and compression is disabled)

    1°) yellow Color section within my TEST PAGE: https://study-sup.fr/zen
    #zenmiddle {
    min-height:50px !important;
    }

    2°) yellow Color section on top of my LANDING PAGE: https://study-sup.fr/
    div#middle {
    height: 50px ;
    min-height: 50px;
    }

    Best regards.
    Noemi.

    September 23, 2018 at 4:49 am #1013203
    Rikard

    Hi Noemi,

    Great, thanks for the update and for sharing your findings. I’ll close the thread for now, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Color section hight (50 px) OK as "Draft Preview" NOT OK if published (100 px)’ is closed to new replies.