-
Search Results
-
In reply to: Snap Scroll does not work
Hi,
Glad to hear this helped, for mobile it looks like you are overriding the 100vh with 100%!important:@media only screen and (max-width: 480px){ .av-layout-grid-container { height: 100% !important; } }I recommend using 100vh;
and for the inner container you are adding: height: auto !important;media only screen and (max-width: 767px){ .responsive #top #wrap_all .av-flex-cells .no_margin { display: block; margin: 0; height: auto !important; overflow: hidden; float: left; clear: none; width: 100%; } }I recommend setting the height to 50vh like this:
@media only screen and (max-width: 767px) { .responsive #top #wrap_all #main .av-flex-cells .no_margin { height: 50vh !important; } }and changing the top padding for mobile to 20px from the current 70px, this looks like the text will then fully show, you could also tweak the font size a little or change the image height a little to allow more room for the text.
Best regards,
MikeTopic: link in table
Hello together
I have created a homepage here
link of the page below:There is a table
there it has links and text
with this code I want to change the colour of the link and the text
colour text the link works white like the link below it
I want the link in the table to have the same colour as the textthe link below must stay white
here is my code:
/*format Tabelle*/
.avia-table tr th, .avia-table tr td {
text-decoration: none !important;
font-size: 15px !important;
color: red !important;
}is the possible
thanks in advance
kind regards
FranzIn reply to: SubLevel Menu Advanced Styling not being Applied
Hey volpagirl,
Thank you for the link to your site, please try this css:.header_color .main_menu ul ul, .header_color .main_menu .menu ul li a span, .header_color .main_menu .menu ul li a:hover { background-color: #930c15; font-size: 16px; font-weight: 600; }After applying the css, please clear your browser cache and check.
Best regards,
MikeTopic: Menu font size
I know this might be a question which has been answered before several times but my search didnt get any results.
How can I change the font size of my main menu items? I need the right CSS
thanksIn reply to: Classic demo and my content – Child theme
Hi,
You can change the main font size under Enfold->General Styling->Typography. Sub level links can be set under Enfold->Advanced Styling.
You can add a link like this in the copyright field:
<a href="https://link.to/site">Link text</a>Best regards,
RikardIn reply to: Menu "falsch" dargestellt
Hi,
Please try the following in Quick CSS under Enfold->General Styling:
@media only screen and (max-width: 990px) { #av-burger-menu-ul li { font-size: 24px; } }Best regards,
RikardIn reply to: Classic demo and my content – Child theme
-How do I increase the general font size? My client keeps saying they want the text to be larger. Main body of text and sub menu items.
-I’ve managed to change this info on the bottom bar but how do I create a link in this area?
© Copyright – Enfold Theme Demo – Enfold Theme by KriesiHope you can help.
In reply to: How to change the default font?
Hi Lene,
Please go to Enfold theme options > General Styling > Typography and adjust “Default Content Font Size” as needed.
Best regards,
YigitHi
We have very different representations of fonts and headings in different mobile browsers. Sometimes graphics are not displayed. How can we solve this problem?
===
Wir haben sehr unterschiedliche Darstellungen von schriften und Überschriften in den verschiedenen mobilen Browsern. Teilweise werden auch Grafiken nicht angezeigt. Wie können wir das Problem lösen?Thanks, solf
In reply to: How to change the default font?
Hey William,
Thanks for your question, please try this css:#top.home #wrap_all .main_color .post-entry.tag-featured-post h2.post-title { font-size:32px; } #top.home #wrap_all .post-entry.bloglist-simple .blog-categories a { font-size:13px; }After applying the css, please clear your browser cache and check.
Best regards,
MikeIn reply to: Font Awesome Icon Before Accordion Title
Hey CopperCityCreative,
Thanks for the link to your site, I see that you have already installed the Font Awesome font, so to add a Font Awesome icon to before the accordion title you first need to find the unicode for the icons you wish to use, for example f09d is a credit card and f3d1 is cash.
Then add the unicode to css like this:.togglecontainer p[data-fake-id="#toggle-id-1"]:before { font-family: "Font Awesome 5 Free"; content: "\f09d"; font-size: 40px; padding-right: 12px; } .togglecontainer p[data-fake-id="#toggle-id-1"] { display: flex; } .togglecontainer p[data-fake-id="#toggle-id-2"]:before { font-family: "Font Awesome 5 Free"; content: "\f3d1"; font-size: 40px; padding-right: 12px; } .togglecontainer p[data-fake-id="#toggle-id-2"] { display: flex; }This is the result:
After applying the css, please clear your browser cache and check.Best regards,
MikeHi there, I cannot get this font, Fraunces, to show up in the Thin 100 weight.
https://fonts.google.com/specimen/FrauncesI would like it to show up in my H2, looking like Fraunces-Thin-100.
Under Quick CSS I have pasted:
h2 {
font-family: ‘Fraunces’, serif !important;
font-weight: 100 !important;
font-size: 38px;
text-transform: none !important;
}——-
The font family, font size, all work well with that CSS code, but not the font weight, trying to get it to be Thin 100.Would you have any ideas? Thank you!
Hi Team,
Looking at my website in Firefox today, I noticed that some text elements are not aligning properly. [See linked page below for example.]
These text elements render correctly in Edge & Chrome.
My custom CSS is below:
Thanks for you assistance,
Stephen.
====
/*
.responsive .container {
max-width: 100%;
padding-right: 0px;
padding-left: 0px;
padding-top: 0px;
padding-bottom: 0px;
}
*/.clientlogo {
text-align: center;
}.clientlogogallery {
max-height: 100px;
}#top .mfp-image-holder .mfp-content {
max-width: 90vw;
}body#top {
font-size: 125%;
}*/
.avia-image-container .avia-image-container-inner {
top: -60px;
padding-top: 0px;
padding-bottom: 0px;
}.responsive .container {
max-width: 100%;
padding-top: 0px;
padding-bottom: 0px;
}
*/#top.blog .post-entry .blog-meta .small-preview .iconfont:before {
display: none;
}#top.blog .post-entry .blog-meta {
display: none;
}#main a {
text-decoration: underline;
}====
In reply to: show the pictures smaller
Hi,
I see you have a custom font size set in your css with !important; it would be best if you change this:@media only screen and (max-width: 767px) h3 { font-size: 23px !important; }If you can’t try this css:
@media only screen and (max-width: 767px) { #vorstand h3.team-member-name { font-size: 12px !important; } }To reduce the top margin of the second row on desktop try this css:
@media only screen and (min-width: 768px) { #top #wrap_all #vorstand .flex_column.av_one_fourth.column-top-margin { margin-top: 25px; } }adjust the number to suit.
Best regards,
MikeIn reply to: Add dotted navigation to testimonial block
Hi,
I see that you have this custom css:@media only screen and (max-width: 767px){ .myslider { margin-left: -40px; margin-right: -25px; margin-top: 25px; margin-bottom: 0.5px; } }To center the items please change it to this:
@media only screen and (max-width: 767px){ .myslider { margin-top: 25px; margin-bottom: 0.5px; } }and then add this css:
@media only screen and (max-width: 767px) { .responsive #top #team .av-large-testimonial-slider.avia-testimonial-wrapper .avia-testimonial { padding: 0; font-size: 0.85em; display: flex; justify-content: center; } }Then to show the arrows remove your custom css:
.avia-slideshow-arrows.avia-slideshow-controls { opacity: 0; } .avia-slideshow-arrows { display: none !important; }Then add this css:
#top #team .avia-slider-testimonials.av-slideshow-ui .avia-slideshow-arrows a { opacity: 1; }Please see the screenshot in the Private Content area of my test results.
Best regards,
MikeHi there,
I have specified the font size for H1 headings in the theme options. However, I want to display a reduced-size font on smaller mobile devices.
So have gone to the text block settings, Styling, Font Size and set a reduced size text for the 2 smallest device sizes. However the settings do not pull through. The text is not reduced on smaller screens. How do I fix this?
Hi I am working on a home page and I need to set a Fullscreen slider with one single picture. Over that I want to show a graphic image (I have it in png and svg), over which a special header appears. Both these elements have been placed using the position absolute and adjusting top/right values.
However when I load the page in front-end I can see the graphic image and text appearing for a millisecond. Then they disappear and appear again when I start scrolling the page. I checked if there was some further advanced rule applied to the elements but there not. How can I keep them visible since the beginning of the loading page?
Here’s my debug code
[av_fullscreen size='2048x2048' control_layout='av-control-default' slider_navigation='av-navigate-arrows av-navigate-dots' nav_visibility_desktop='' nav_arrow_color='' nav_arrow_bg_color='' nav_dots_color='' nav_dot_active_color='' image_attachment='' animation='slide_up' transition_speed='' autoplay='false' interval='5' conditional_play='' img_scrset='' lazy_loading='disabled' id='' custom_class='home-open-img' template_class='' av_uid='av-ldk05icf' sc_version='1.0'] [av_fullscreen_slide slide_type='image' id='116' position='center center' video='https://' mobile_image='' fallback_link='https://' title='' video_cover='' caption_pos='caption_right' custom_title_size='' av-desktop-font-size-title='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' custom_content_size='' av-desktop-font-size='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' font_color='' custom_title='' custom_content='' heading_tag='' heading_class='' link_apply='' link='lightbox' link_target='' button_label='Click me' button_color='light' link1='manually,http://' link_target1='' button_label2='Click me' button_color2='light' link2='manually,http://' link_target2='' overlay_opacity='0.5' overlay_color='' overlay_pattern='' overlay_custom_pattern='' av_uid='av-uv4f' sc_version='1.0' video_autoplay='' video_controls='' video_mute='' video_loop='' overlay_enable=''][/av_fullscreen_slide] [/av_fullscreen] [av_image src='http://localhost:8888/rialto1082.com/wp-content/uploads/2023/01/bridge-graphic.png' attachment='97' attachment_size='full' copyright='' caption='' image_size='no scaling' styling='' box_shadow='none' box_shadow_width='10' box_shadow_color='' align='center' font_size='' overlay_opacity='0.4' overlay_color='#000000' overlay_text_color='#ffffff' animation='no-animation' animation_duration='' animation_custom_bg_color='' animation_z_index_curtain='100' parallax_parallax='' parallax_parallax_speed='' av-desktop-parallax_parallax='none' av-desktop-parallax_parallax_speed='' av-medium-parallax_parallax='none' av-medium-parallax_parallax_speed='' av-small-parallax_parallax='none' av-small-parallax_parallax_speed='' av-mini-parallax_parallax='none' av-mini-parallax_parallax_speed='' hover='' blur_image='' grayscale_image='' fade_image='' appearance='' css_position='' css_position_location=',-50%,150%,' css_position_z_index='10' av-desktop-css_position='absolute' av-desktop-css_position_location=',-50%,260%,' av-desktop-css_position_z_index='10' av-medium-css_position='absolute' av-medium-css_position_location=',-30%,260%,' av-medium-css_position_z_index='10' av-small-css_position='absolute' av-small-css_position_location=',-30%,260%,' av-small-css_position_z_index='10' av-mini-css_position='absolute' av-mini-css_position_location=',-30%,260%,' av-mini-css_position_z_index='10' transform_perspective='' transform_rotation=',,,' transform_scale='1.5,1.5,1.5' transform_skew=',' transform_translate=',,' av-desktop-transform_perspective='' av-desktop-transform_rotation=',,,' av-desktop-transform_scale=',,' av-desktop-transform_skew=',' av-desktop-transform_translate=',,' av-medium-transform_perspective='' av-medium-transform_rotation=',,,' av-medium-transform_scale=',,' av-medium-transform_skew=',' av-medium-transform_translate=',,' av-small-transform_perspective='' av-small-transform_rotation=',,,' av-small-transform_scale=',,' av-small-transform_skew=',' av-small-transform_translate=',,' av-mini-transform_perspective='' av-mini-transform_rotation=',,,' av-mini-transform_scale=',,' av-mini-transform_skew=',' av-mini-transform_translate=',,' mask_overlay='' mask_overlay_shape='blob' mask_overlay_size='contain' mask_overlay_scale='100%' mask_overlay_position='center center' mask_overlay_repeat='no-repeat' mask_overlay_rotate='' mask_overlay_rad_shape='circle' mask_overlay_rad_position='center center' mask_overlay_opacity1='0' mask_overlay_opacity2='1' mask_overlay_opacity3='' link='' target='' title_attr='graphic-motif' alt_attr='graphic motif' img_scrset='' lazy_loading='disabled' av-desktop-hide='aviaTBav-desktop-hide' av-medium-hide='aviaTBav-medium-hide' av-small-hide='aviaTBav-small-hide' av-mini-hide='aviaTBav-mini-hide' id='' custom_class='' template_class='' av_element_hidden_in_editor='0' av_uid='av-ldk1oq0a' sc_version='1.0' admin_preview_bg=''][/av_image] [av_one_full first min_height='' vertical_alignment='av-align-top' space='' row_boxshadow_width='10' row_boxshadow_color='' margin='0px' margin_sync='true' av-desktop-margin='' av-desktop-margin_sync='true' av-medium-margin='' av-medium-margin_sync='true' av-small-margin='' av-small-margin_sync='true' av-mini-margin='' av-mini-margin_sync='true' mobile_breaking='' mobile_column_order='' border='' border_style='solid' border_color='' radius='' radius_sync='true' min_col_height='' padding='' padding_sync='true' av-desktop-padding='' av-desktop-padding_sync='true' av-medium-padding='' av-medium-padding_sync='true' av-small-padding='' av-small-padding_sync='true' av-mini-padding='' av-mini-padding_sync='true' svg_div_top='' svg_div_top_color='#333333' svg_div_top_width='100' svg_div_top_height='50' svg_div_top_max_height='none' svg_div_top_opacity='' svg_div_bottom='' svg_div_bottom_color='#333333' svg_div_bottom_width='100' svg_div_bottom_height='50' svg_div_bottom_max_height='none' svg_div_bottom_opacity='' column_boxshadow_width='10' column_boxshadow_color='' background='bg_color' background_color='' background_gradient_direction='vertical' background_gradient_color1='#000000' background_gradient_color2='#ffffff' background_gradient_color3='' src='' attachment='' attachment_size='' background_position='top left' background_repeat='no-repeat' highlight_size='1.1' animation='' animation_duration='' animation_custom_bg_color='' animation_z_index_curtain='100' parallax_parallax='' parallax_parallax_speed='' av-desktop-parallax_parallax='' av-desktop-parallax_parallax_speed='' av-medium-parallax_parallax='' av-medium-parallax_parallax_speed='' av-small-parallax_parallax='' av-small-parallax_parallax_speed='' av-mini-parallax_parallax='' av-mini-parallax_parallax_speed='' css_position='' css_position_location=',-30%,150%,' css_position_z_index='' av-desktop-css_position='absolute' av-desktop-css_position_location=',-40%,320%,' av-desktop-css_position_z_index='15' av-medium-css_position='absolute' av-medium-css_position_location=',-30%,320%,' av-medium-css_position_z_index='15' av-small-css_position='absolute' av-small-css_position_location=',-30%,320%,' av-small-css_position_z_index='15' av-mini-css_position='absolute' av-mini-css_position_location=',-20%,320%,' av-mini-css_position_z_index='15' link='' linktarget='' link_hover='' title_attr='' alt_attr='' mobile_display='' mobile_col_pos='0' id='' custom_class='' template_class='' aria_label='' av_uid='av-12txf' sc_version='1.0'] [av_heading heading='Rialto 1082<br/>Venice Bed & Breakfast' tag='h1' style='blockquote modern-quote modern-centered' subheading_active='subheading_below' show_icon='' icon='ue800' font='entypo-fontello' size='' av-desktop-font-size-title='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='26' subheading_size='' av-desktop-font-size='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='16' icon_size='' av-desktop-font-size-1='' av-medium-font-size-1='' av-small-font-size-1='' av-mini-font-size-1='' color='custom-color-heading' custom_font='#ffffff' subheading_color='#ffffff' seperator_color='' icon_color='' margin='' margin_sync='true' av-desktop-margin='' av-desktop-margin_sync='true' av-medium-margin='' av-medium-margin_sync='true' av-small-margin='' av-small-margin_sync='true' av-mini-margin='' av-mini-margin_sync='true' headline_padding='' headline_padding_sync='true' av-desktop-headline_padding='' av-desktop-headline_padding_sync='true' av-medium-headline_padding='' av-medium-headline_padding_sync='true' av-small-headline_padding='' av-small-headline_padding_sync='true' av-mini-headline_padding='' av-mini-headline_padding_sync='true' padding='10' av-desktop-padding='' av-medium-padding='' av-small-padding='' av-mini-padding='' icon_padding='10' av-desktop-icon_padding='' av-medium-icon_padding='' av-small-icon_padding='' av-mini-icon_padding='' link='' link_target='' id='' custom_class='' template_class='' av_uid='av-ldk1eds5' sc_version='1.0' admin_preview_bg=''][/av_heading] [/av_one_full]In reply to: The logo is cut out
Hey maryenvato,
Thank you for the inquiry.
Have you tried decreasing the font size of the main menu items? The style of the main menu can be adjusted in the Enfold > Advanced Styling panel. You can also adjust the Maximum Container Width value in the Enfold > General Layout > Dimensions panel.
Best regards,
IsmaelIn reply to: Fullwidth Easy Slider Text on homepage via mobile
Hi carlosTLM98,
Please edit the Fullwidth Easy Slider, then edit the slide item, go to Styling > Font Sizes > edit Caption Title Font Size and Caption Content Font Size (make sure that the mobile device icon on the top of it is selected).
Hope this helps.Best regards,
NikkoIn reply to: Custom Icon Bullets
Hey Monika,
Thanks for the link to your page, please try this css instead:.bullets li { list-style: none!important; } .bullets li { padding-left: 40px; } .bullets li:before { content: '\e805'; font-family: 'wery-designstudio-icons'; font-size: 23px; font-weight: normal; position: absolute; left: 6px; }After applying the css, please clear your browser cache and check.
Best regards,
MikeTopic: Custom Icon Bullets
Hey there,
i tried to customize my Bullets, but somehow it does not work. Instead of the Icon, he shows me just the Text “ue805”.
But I put the Icon also in the Text editor to see which number it has.
This icon I want:
[av_font_icon icon='ue805' font='wery-designstudio-icons' style='' caption='' link='' linktarget='' size='20px' position='left' animation='deactivated' color='' av_uid='av-2amarj' custom_class='haken' admin_preview_bg=''][/av_font_icon]and this is my css:
`
.bullets li {
list-style: none!important;
}.bullets li {
padding-left: 40px;
}.bullets li:before {
content: ‘ue805’;
font-family: ‘wery-designstudio-icons’;
font-size: 23px;
font-weight: normal;
position: absolute;
left: 6px;
}Cheers
MonikaTopic: various
Hi,
I need help again with Responsive customization of a website – a onepager.
1. customization in the offers section (screenshot on the normal laptop is in the dropbox – screenshot 1). I used a ready background image and set a minimum height and spacing from the bottom in the columns. This worked until the middle screen size in the customizer (screenshot 2). From 768px and smaller it is not possible to place the text inside the area above the background image. Either there is too much space under the text (screenshot 3) or the text goes into the image (screenshot 4). What can be done?
2. at the customer recommendations the distances are not correct – see screenshot 5 and the font is too big. The round images are partly cut off at the top.
3. if you scroll down on the mobile, there are partly white or brown thin stripes between the color sections – I don’t understand that either.
That was now unfortunately a bit much and maybe I could have solved the part with the offers also differently …
In advance, thank you very much – all links are in private content.
Many greetings, Sabine
Translated with http://www.DeepL.com/Translator (free version)
In reply to: Secondary Menu Styling (font style & size)
Hi,
Thank you for the link.
You can use this css code to adjust the style of the submenu items.
#top .av-subnav-menu > li > a { padding: 0px 10px 0px 12px; display: block; border-left-style: solid; border-left-width: 1px; font-weight: 600; font-size: 1.5em; }Best regards,
IsmaelI’ve had a good scan for the specifics of this, apologies if it’s obvious in a previous post
I am running a secondary menu that’s a bit like a banner with three html links on it. I can change the font colour under “General Styling / Socket” but I just can’t figure out how to change the font size and style (bold etc).
I found some Quick CSS on previous posts that don’t seem to do anything.
Is there a way to do this, an easy way? :)
Thanks in advance. I tried!
In reply to: row too high on mobile
Hi,
For the special heading element you can choose the font size based on screen size, go to the screen options tab and pick your sizes:
Best regards,
MikeIn reply to: slider on store like home
Hi,
I changed your code to this:add_action( 'ava_after_main_container', 'ava_after_main_container_mod', 10 ); function ava_after_main_container_mod() { if ( !is_front_page() ) { $output = ''; $output .= do_shortcode('[rev_slider alias="routiers-cvfl"][/rev_slider]'); echo $output; } if ( is_front_page() ) { $output = ''; $output .= do_shortcode("[av_image src='https://routiers-cvfl.li/wp-content/uploads/2023/01/schloss-gutenberg.jpg' attachment='3159' attachment_size='full' copyright='' caption='' image_size='' styling='' align='center' font_size='' overlay_opacity='0.4' overlay_color='#000000' overlay_text_color='#ffffff' animation='no-animation' hover='' appearance='' link='' target='' title_attr='' alt_attr='' img_scrset='' lazy_loading='disabled' id='' custom_class='' template_class='' av_element_hidden_in_editor='0' av_uid='' sc_version='1.0' admin_preview_bg=''][/av_image]"); echo $output; } }This shows the slider on all pages except the homepage, on the home page it shows the image you asked for, but it could show a different slider if you wished.
Best regards,
MikeIn reply to: row too high on mobile
Ok thank you Mike, this was ecactly what i needed to know.
last question about font sizes on mobiles, i can figure it out myself i think.if you want, you can close this ticket
best regards, jelleIn reply to: frame as circle
Hi,
I added the custom class onethirdcircle to the three circles in all three languages and then adjusted the script to look for this class.
I then added this css in the Enfold Theme Options ▸ General Styling ▸ Quick CSS field for all three languages to center the text on mobile and cleared your cache for each language:@media only screen and (max-width: 767px) { .responsive #top .sc-av_one_third .flex_column_table_cell.onethirdcircle { display: flex; justify-content: center; flex-direction: column; } }Then to reduce the size of the circles and center them horizontally for mobile I added this css in the Enfold Theme Options ▸ General Styling ▸ Quick CSS field for all three languages to center the text on mobile and cleared your cache for each language:
@media only screen and (max-width: 767px) { .responsive #top .sc-av_one_third .flex_column_table_cell.onethirdcircle { max-width: 300px; margin: auto !important; } }In my tests this is the smallest that you can use in all three languages and still have it look good based on the words, is some languages the words are too long without a break so it doesn’t fit in the circle well. Perhaps if you made the font smaller you could have a smaller circle but then would the text easily be readable?
You can test further if you like, please clear your mobile browser cache and check.
Please see the screenshot in the Private Content area of the mobile results.Best regards,
MikeMy page title is not displaying in Pages. I found another topic with the same problem as mine and the user was instructed to use this Quick CSS:
.title_container { background: #d6d6d6; } .title_container .main-title a { color: black!important; font-size: 20px; }This did not work for me. Here is the About page link: https://newsite.arclivingston.com/newsite2022/about/
You will not be able to view without credentials since it’s a staging site that hasn’t been launched, so I have included that in the private section below.
Thank you,
Diane`
