Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #755603

    I added widget to the header with these instructions.

    I use this css:

    #header.widget {
    left: 50%;
    padding-top: 0;
    position: absolute;
    top: 0;
    transform: translate(-50%);
    z-index: 999;
    vertical-align: middle;

    }
    @media screen and (max-width: 1000px) {
    #header .widget{
    display:none }
    }
    .helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    }

    widget should be inline with logo on the right side..

    What am i doing wrong?

    • This topic was modified 3 years, 7 months ago by  spavli2.
    #755619

    Hey spavli2,
    Is this what you are trying to achieve?
    postimage
    Try this code in the General Styling > Quick CSS field:

    #header .widget {
      left: 50%;
      padding-top: 0;
      position: absolute;
      top: 0;
      transform: translate(-50%);
      z-index: 999;
    }

    You had no space between #header & .widget
    Best regards,
    Mike

    #755630

    omg. thanks for quick help.

    Its working.

    #755632

    the difference was !

    #header.widget to #header .widget
    the spacebar is missing
    with no space the class has to be directly on the header container
    without space there is a class following the header container.

    you did it right on the media querry – maybe only a careless mistake

    #755636

    Hi,
    @spavli2, Your welcome and Thank you for using Enfold.
    @guenni007, Thanks for helping :)

    Best regards,
    Mike

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.