I can’t get tags to show on my blog post. I think a previous developer may have put something in the Quick CSS?

.avia_cart_buttons .product_type_external {
padding: 11px !important;
background: #ffbe46 !important;
}

.avia_cart_buttons .product_type_external:hover {
background: #95d500 !important;
}

.avia_wpml_language_switch {
display: none;
}

@media screen and (max-width: 599px) and (max-height: 320px) {
.responsive.html_mobile_menu_tablet.html_visible_cart #top .cart_dropdown {
right: 95px !important;
}
}

.language_flag {
display: none !important;
}

.single-product .product {
width: 100%;
}
.single-product-summary {
float:left;
width:45%;
margin-right: 3%;
}

.single-product-main-image {
width: 25%;}

.sidebar {
padding-top: 0px;}

#top.tax-product_cat .product-sorting {display:none;}

.avia_cart_buttons { opacity: 1; }
#top .main_color .avia_cart_buttons .button { color: white; }
.header_color .cart_dropdown_link { background-color: #FFBE46; }
.header_color .cart_dropdown_first .cart_dropdown_link { color: white; }

.single .cart .button { background-color: #FFBE46!important; color: white!important; }

#containerIntro h3,
#containerIntro p {
display: inline;
}
.language_es, .language_en, .language_fr {
display: none;
}

#lang_sel {
height: 75px;
}

.post-meta-infos { display: none; }

.widget {
font-size: 18px;
}

.avia-button.avia-size-large { font-size: 18px; } /* for large buttons */
.avia-button.avia-size-medium { font-size: 18px; } /* for medium buttons */
.avia-button.avia-size-small { font-size: 18px; } /* for small buttons */

.slide-content .blog-categories.minor-meta {
display: none;
}

.avia-button-wrap span.avia_iconbox_title {
font-size: 20px; font-weight: light;
}

.avia-button-fullwidth {
padding: 4px!important;
}

@media only screen and (max-width: 1100px) {
#mobile-advanced, #advanced_menu_toggle, #advanced_menu_hide { display: block; }
nav.main_menu { display: none; }}
#wrap_all {
position: relative !important;
}

.portfolio-preview-image {
width: 500px;
}
.portfolio-preview-content {
width: 70%;
}
.inner-entry .grid-content {
min-height: 115px !important;
}
.grid-entry-title {
font-size: 18px;
color: #96c93d !important; }
.grid-entry-excerpt {
font-size: 14px;
font-style: normal; }

@media only screen and (max-width: 479px) {
.responsive #socket .sub_menu_socket {
display: block !important;
width: 100%;
}

.responsive #socket .sub_menu_socket ul li {
float: none;
border-left: none;
text-align: center;
}

}

@media only screen and (max-width: 767px) {
.responsive #socket .sub_menu_socket ul li {
padding: 10px;
font-size: 15px;
}
}

#footer .widgettitle {
font-size: 20px;
text-align: center;
}

.tribe-events-before-html div {
height:auto!important;
}

#top .main_color .avia-button.avia-color-theme-color:hover { border-color: red; color: black; }

I do see that my website is not creating very nice pages where I have used Color Section in combination with Special Headings. I also see that H1, H2 and H3 are nice on a desktop, but to big in size on mobile devices.

What is the right way to handle the fontsize of these elements on mobile devices?

Is there no trick to get for example 75% of regular size to be used on Mobile devices?

If I have to resize all elements based on media queries in my CSS, that I have to do quite a lot of specifications.

Hello! I’m using Enfold Theme, and I installed the flat business demo. When I look at the site on a mobile device, the text I have entered as the heading in the Special Heading in the first Color Section does not get resized to fit the mobile… So I can manually reduce the text size and that is fine, but if I leave it at the optimum size for viewing on a computer, the text gets cut off on a mobile. Should this be resizing, or is that degree of responsiveness not built?

See http://whole.drewwelsh.com

Thanks!

I have the following code in a button put into a text-element. Showing the generated code in the debugger window:

[av_textblock size='' font_color='' color='']
[av_button label='Additional 10% Off Today' link='manually,Javascript: alert("Message Here");' link_target='' size='large' position='left' icon_select='no' icon='ue800' font='entypo-fontello' color='theme-color' custom_bg='#444444' custom_font='#ffffff']
[/av_textblock]

With the Javascript in the link, it always worked prior to 4.5 without a problem, and I use JavaScript throughout the site like this. It still works – the live page and Javascript operate, but the advanced editor now hangs with the “forever busy” icon”, and the elements are never shown, thus I can’t edit them without using the debugger window.

I have taken all the remedial options suggested for 4.5 and nothing helps Enfold is at the latest version.

I am a bit desperate to be able to change the page – on several sites.

Good Morning,

I Have probem with the menu you can look two screen here :

http://www.noelshack.com/2016-18-1462140491-capture-d-ecran-2016-05-02-a-00-06-34.png (in this one i just wan’t in one line)
http://www.noelshack.com/2016-18-1462140491-capture-d-ecran-2016-05-02-a-00-06-41.png (with this one the menu is cut)

I had this code in my CSS :

.av-main-nav #menu-item-3484 ul {
left: -130px;
}
li#menu-item-3407 ul.sub-menu {
width: 100%;
}
.current-menu-item > a > .avia-menu-fx {
display: none;
}
{
font-family: ‘din_lightregular’, Tahoma, Geneva, sans-serif;
color: #ffffff;
font-size: 13px;
line-height: 1.4em;
}

But it’s doesn’t work.

Best Regard,
Noé

Hi there,

i have recently updated wordpress etc..

My menu seems to have changed.
I am using a child theme.

Will you please visit the site and see what I need to change to widen my submenu links out again.
They have become way too narrow.

Also here is what i have in quick css:
This is what was there before but is possible i have something wrong anyway.
.logo {
visibility: hidden !important;
}

#top #header .mega_menu_title a { font-size: 12px;}

#top #header .avia_mega_div > .sub-menu.avia_mega_hr {
padding-top: 5px; }
#top #header .avia_mega_div > .sub-menu {
padding: 5px 10px 10px; }

.main_menu ul:first-child > li > a{
padding: 0 6px !important;
}

.main_menu ul:first-child>li>a {
font-size: 12px;
}

.sub-menu{
padding-top: 1px !important;
padding-bottom: 1px !important;
}
.sub-menu li > a {
font-size: 14px !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.avia_mega_div .avia-bullet{
margin-top: 1px;
}

#top #header .mega_menu_title a {
font-size: 12px !important;
line-height: .8em !important;
min-height: 15px;
}

#header .mega_menu_title {
font-weight: 500 !important;
}

End

Thank you