Hi Victoria,

thanks! That works for the button.
How can I adjust the height of the text-fields (for email address and first name)?

Hi Victoria,

on Desktop that seems to be fine, but e.g. on tablet portrait mode the “first name” field is indented (see screenshot here).

And could you please advise the best way how to increase (just a little bit) the height of the fields (email and first name) and the button?

Hi Victoria,

I just deactivated caching and minification.

BR

Hi Victoria,

no hiding won’t be a good option then.

But I don’t really understand:
Why is the empty div for the responses (which takes no space in the normal view) preventing to distribute the other 3 fields (email adress, first name and submit-button) evenly over the width?

Hi Victoria,

I wrote my reply a bit too quickly :)

Did you mean the div #mce-responses?
The #mce-responses is the Container for error responses, so it wouldn’t be a good idea to delete it as I was suggesting ;)
But isn’t it anyways hidden, so why make it smaller? (Sorry if I misunderstand)

Unfortunately, this is not the Enfold Form but the MailChimp code for embedded forms, which I adapted according to this article.
I would love to use the Enfold form but I can’t because it is not supporting the group selectors (or hidden groups).

I am happy for any suggestions to get this form nicely distributed with each field (email, name, button) 1/3 of the width.

Abort mission :)

I give up on the popup (I encounterd another prob), so you can close the topic.

Hi Victoria,

that solved the problem, thank you very much!!

Best regards,
catchbudapest

Hi Mike,

yes, can be closed.

Thanks again and best regards,
Florian

Hi Victoria,
is now deactivated!

Hi Mike,

looks good now, all issues are solved!
Thanks a lot for your help!

Best,
Florian

Hi Mike,

thanks that work, but could you please change the color code of the social icons from black to grey (same grey as in the mobile view).
Here a screenshot of the tablet view and here of the mobile view).

And could you please tell me which CSS-code is still necessary?
I kept the code of your first posting and just added the code of your second posting.
And I also still kept the CSS-code from my first posting above.

Can I delete or summarize some of this?

/* logo-menu overlapping Anfang */ 
@media only screen and (max-width:1024px) {
  .responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item {
    display: none;
  }

  .responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item-avia-special {
    display: block !important;
  }
}

@media only screen and (max-width:767px) and (min-width:480px) {
  .responsive #top #header .logo img {
    max-width: 50%;
  }
}
/* logo overlapping Ende*/ 

/*header color for tablet*/
@media only screen and (max-width: 989px) {
.responsive #top .av_header_transparency.av_alternate_logo_active .logo a>img {
    opacity: 1 !important; 
}
#top #wrap_all .av_header_transparency {
    background-color: #fff !important; 
}
.responsive #top #wrap_all .av_header_transparency .main_menu ul:first-child>li>a {
    color: #969696 !important; 
}
.av_header_transparency div .av-hamburger-inner, .av_header_transparency div .av-hamburger-inner::before, .av_header_transparency div .av-hamburger-inner::after {
background-color: #969696 !important; 
}
}

@media only screen and (max-width: 989px) {
#top #wrap_all .social_bookmarks a {
color: #000 !important;
}
.avia-menu.av_menu_icon_beside {
padding: 0px !important;
margin-right: 12px !important; 
}
}

Hi Mike,

thanks for the help!
The background is now white but the social media icons are not visible anymore (since they are white as well).
(See screenshot here).

The issue with the logo overlapping is not solved yet (see screenshot above).
I have a iPad Air 2 with a screen resolution of 1536 x 2048 pixels.
The problem appears only in portrait mode.

Best,
Florian

Hi Victoria,

Yes, after the last modification it finally works :)

Thanks for the reply!

Brilliant @ismael, that works!
The logo is back for the 2 relevant pages (page-id-7219 and page-id-7690).

Would it also be possible to realize a non sticky header for these 2 pages (as we did it for the single post pages).

My current CSS-code for this matter looks like this:

#top .av-logo-container {
    display: none;
}

#top .av_header_transparency .av-logo-container {
    display: block;
}

#top.single .av-logo-container {
    display: block;
}

#top.page-id-7219 .av-logo-container {
    display: block;
}

#top.page-id-7690 .av-logo-container {
    display: block;
}

@media only screen and (min-width: 768px) {
.responsive.html_mobile_menu_tablet #top.single #wrap_all #header {
    position: relative;
    width: 100%;
    float: none;
    height: auto;
    margin: 0 !important;
    opacity: 1;
    min-height: 0;
}

.html_header_top.html_header_sticky #top.single #wrap_all #main {
    padding-top: 0;
}
}

Hi Victoria,

thanks for the quick reply!

Below the temporary admin access to my website.

I also added the code which has to be added to the footer, below in the private section.

• This reply was modified 6 years, 5 months ago by catchbudapest. Reason: Code added in the private section