-
Search Results
-
Topic: Dropcap vertical align
Vorrei sapere come modificare l’allineamento verticale del dropcap per fare in modo che la lettera grande sia allieneata in basso con il testo che segue (nel link che allego ho l’attuale situazione: vorrei che la “E” fosse allineata nella parte bassa con il teso che segue)
Nel CSS ho provato a mettere questo:
.av_dropcap1 {
font-size: 70px;
color: #993f32 !important;
text-align: top !important; }In reply to: Double check your top menu bar
Thanks Rikard, I think I mentioned in my original post that it’s not related to font-size :) Even at 14px there is conflict.
Topic: Site Formatting Problems
Hi
I am having trouble with this site. Some of the font formatting has disappeared and when I try re-introducing the formatting/CSS it’s not being recognised. Examples are: the H1 headings had all reduced and changed colour; the phone number top right used to be larger text and white; the H1 headings should all be #31628f as default, but I’m having to go through the site and put these in as custom colours; the font size in the slider captions has reduced.
Any ideas why this might have happened?
Many thanks
In reply to: How to Fix Font Glitch
by the way : on headings it is not so important but on text-block it might be a good idea to have not the line-height disturbed by up and down positioning.
it seems that these values preserve line-height on most cases:sub, sup { font-size: 0.75em; line-height: 0; position: relative; vertical-align: baseline} sup {top: -0.5em} sub {bottom: -0.25em}and maybe you will have than different values for your headings
h1 sup …
h2 sup etc ppIn reply to: How to Fix Font Glitch
it will be better to see the online page and the links to it.
i do not know why – because em is a relativ to parent settings value ?
first the sub and sup has an implemented font-size : smaller
maybe you overwrite it first by:sup, sub { position: relative; vertical-align: baseline; font-size: 1em; top: -0.4em; }and look what happend than
if we do not find a different solution i would do it this way:
sup, sub { position: relative; vertical-align: baseline; } .page-id-abc sub { top: 0.4em; } .page-id-abc sup { top: -0.4em; } .page-id-def sub { top: 0.8em; } .page-id-def sup { top: -0.8em; }etc. pp.
In reply to: Double check your top menu bar
Hi,
I think you will have to adjust the font sizes for each screens size to get that looking right. Try this to make the phone numbers a bit smaller on tablets:
@media only screen and (max-width: 990px) { #header_meta .phone-info, #header_meta .phone-info span { font-size: 16px !important; } }Best regards,
RikardIn reply to: Content Slider Question
Hi Havi,
I have modified your css code in Quick CSS:
/*slider arrows css */ #top .avia-smallarrow-slider .avia-slideshow-arrows { width: 505px; height: 50px; display: block; position: absolute; top: 270px; } #top .avia-smallarrow-slider .avia-slideshow-arrows a { background: transparent!important; color: #fff; width: 50px; height: 50px; font-size: 50px; font-weight: bolder; } #top .avia-smallarrow-slider .avia-slideshow-arrows a:before { background: transparent !important; line-height: 50px; }Let us know if it helps :)
Best regards,
NikkoIn reply to: Black Box in Lightbox
Hi Sarah,
Yes, I have checked it and the text showing on mouseover has spaces in between each letters/numbers. You can remove the spaces and use this:
#top .av-caption-style-overlay .av-masonry-entry .av-masonry-entry-title { letter-spacing: 0.05em; font-size: 40px; }Just adjust the font size and letter spacing :)
Best regards,
NikkoTopic: Bug – Fullwidth Easy Slider
Hello. Any settings made here, are not working. It requires addtional CSS to be added.
I’ll also submit a Feature Request, but just in case the right person(s) is listening…
To help with Enfold adoption/satisfaction, please continue to consider basic users. Having a description of “Font Size for medium-sized screens” has been raising questions from my clients. They have no idea what “medium-sized” vs. “very small sized ” means.
Thank you!
In reply to: Black Box in Lightbox
Hi Nikko,
that works very nice, thanks a lot!!
But now I have the same Problem with the text, that appears by mouseover. Is there a way to change the letter spacing and the font size unattached by the body text? Preferably in each case for different screens.Thank you in advance!
SarahHello,
There is something preventing your screen option settings from working – this is the code responsible for hiding elements when the checkboxes under screen options are set:
@media only screen and (min-width: 990px){ .responsive.av-no-preview #top #wrap_all .av-desktop-hide, .responsive.av-no-preview #top #wrap_all .av-desktop-font-size-hidden, .responsive.av-no-preview #top #wrap_all .av-desktop-font-size-title-hidden{display:none;} } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 989px) { .responsive.av-no-preview #top #wrap_all .av-medium-hide, .responsive.av-no-preview #top #wrap_all .av-medium-font-size-hidden, .responsive.av-no-preview #top #wrap_all .av-medium-font-size-title-hidden{display:none;} } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) { .responsive.av-no-preview #top #wrap_all .av-small-hide, .responsive.av-no-preview #top #wrap_all .av-small-font-size-hidden, .responsive.av-no-preview #top #wrap_all .av-small-font-size-title-hidden{display:none;} } /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { .responsive.av-no-preview #top #wrap_all .av-mini-hide, .responsive.av-no-preview #top #wrap_all .av-mini-font-size-hidden, .responsive.av-no-preview #top #wrap_all .av-mini-font-size-title-hidden{display:none;} }However, the .no-preview-class is never added to the HTML, so hiding anything doesn’t work at all. Can you please fix this?
Hello,
1. I set the full-screen slider in main page, but slider doesn’t fit.
The bottom of the slider does not fit. What should I do if the size of the slider should not be left and it should be exactly the size of the bottom of the slider?
2. I want to set page select dot button size in slider. How can I edit it?
3. I want to edit style particular menu item in main menu.
To emphasize tel number(last menu item), I wrote css selector like this “#menu-item-836>.avia-menu-text” for editing font-size. But it doesn’t work. Can you tell me what is correct selector code?
Thank you for your help :D
Hi Support,
I have an issue with the display of Mega Menu in Chrome.
I’d like the text to align to images like this:
but it displays that way:
here is my css:
/*mega menu*/
.mm {display:table!important;margin:15px 5px;min-width:150px;min-height:80px;text-align:left;z-index:above}
.mm a {line-height:1.3!important;text-decoration:none!important; padding-left:0px!important;width: 110px !important;}
.mm img,.mm a {vertical-align: middle; display:table-cell!important;position: relative;}
.mm img{height:30px;min-width:30px!important}
#header .mega_menu_title {font-family:’Tangerine’, ‘HelveticaNeue’, ‘Helvetica Neue’, Helvetica, Arial, sans-serif!important;color:#cb9d1d!important;font-size:30px!important;font-weight:normal!important}
@media only screen and (max-width: 1000px) {#header .avia_mega_div {display:none!important}}In reply to: Content Slider Question
Hi Nikko!
Yes, that’s what I had in the beginning but it doesn’t quite work. There’s a gray overlay. I’d like to make the arrows more visible (that’s why I moved the title under them – so that the eyes go towards the navigation) That has been my goal all along. Make it really clear to the site visitors how to navigate te slides.
Here’s the CSS I have for all the changes you see on that page:
/*slider arrows css */
#top .avia-smallarrow-slider .avia-slideshow-arrows {
width: 150px;
height: 50px;
}
#top .avia-smallarrow-slider .avia-slideshow-arrows a {
background: white !important;
color: #67b6e1;
width: 50px;
height: 30px;
font-size: 25px;
font-weight: bolder;
}
.html_elegant-blog .avia-content-slider .slide-entry-title {
padding-top: 1px;
font-size: 1.1em !important;}.html_elegant-blog .avia-content-slider .slide-entry-title {
text-align: right;
text-transform: none !important;
padding: 0 40px 15px !important;
}Warmly,
Havi
In reply to: Modern Business Style Blog
Hi,
Please use the following css codes.
time.slide-meta-time.updated { width: 100%; display: block; text-align: center; color: gray; font-size: 14px; }If you want to decrease the space above the date, use this.
.html_modern-blog #top #wrap_all .avia-content-slider .post-entry .slide-content h3 { padding-bottom: 0; margin-bottom: 0; }Best regards,
IsmaelIn reply to: partner logo element header font size
I added this, and it worked. However, it took all the logos up by a few pixels.
I tried to correct it, setting the line height (line-height: 29px !important;). That also worked. Final result is this:
/*partner logo*/
#top .avia-smallarrow-slider-heading h3 {
font-style: italic !important;
font-size: 18px !important;
line-height: 29px !important;
}
/* end partner logo*/Hi, The problem is only from smartphones, Tablet and Pc Desktop is All OK.
With transparency enabled when you scroll down after a while a piece of menu bar appears and disappears once you return to the top of the page.
I want that scrolling down the current menu displayed with transparency disappears along with the image without creating shots or various movements …
I left my credentials, ThanksMy CSS:
@media only screen and (max-width: 767px) {
#header_meta .container {
max-height: 30px;
}
#top .av_header_transparency #header_main {
top: -50px;
}
}@media only screen and (max-width: 767px) {
.responsive .logo img { max-height: 40%; top: 0px; }}.weather {
position: relative;
float: right;
top: -10px;
right: 110px;
}#top .sub_menu>ul {
float: left;
margin: 0;
right: -40px;
position: relative;
}@media only screen and (max-width: 767px) {
.weather {
top: -30px;
}
.responsive #header_meta .sub_menu ul{
text-align:right!important;
color:#000!important;
}
}.header_color .weather { color: black; }
#top .av_header_transparency #header_meta {
border-bottom: none! important;
}.logo {
margin-top: -30px;
margin-left: -10px;
}.header-scrolled .logo { margin-top: 0; }
.inner_sidebar {
margin-left: 30px;
}.main_color table,
#top .main_color .avia-data-table.avia_pricing_minimal th {
background: transparent;
}#top.page-template-default.page.stretched #main .container:before {
content: ‘ ‘;
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0.2;
background-image: url(https://residenzeparadiso.com/wp-content/uploads/2017/12/chaplet-2489637_1920.jpg);
background-repeat: no-repeat;
background-size: cover;
}#top.page-template-default.page.stretched #socket .container:before {
background-image: url(https://residenzeparadiso.com/wp-content/uploads/2018/01/whitebackground.png) !important;
background-repeat: repeat;
}#top.page-id-61 .inner_sidebar {
font-style: normal!important;
}@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .container {
width: 100%!important;
max-width: 100%!important;
padding-left: 25px!important;
padding-right: 25px!important;
}}In reply to: partner logo element header font size
Hey Steve,
Try adding h3 to your rule like this:/*partner logo*/ #top .avia-smallarrow-slider-heading h3 { font-style: italic !important; font-size: 18px !important; } /* end partner logo*/Best regards,
MikeIn reply to: Team Page Shortcode
Hey suhasratan,
Here are the shortcodes from that page:
[av_textblock] <h2 style="text-align: center;">Learn about our Team and Culture</h2> <p style="text-align: center;">We are a team of dedicated professionals, ready to do what ever it takes to make your business grow</p> [/av_textblock] [av_hr class='short' height='50' shadow='no-shadow' position='center'] [av_one_half first] [av_team_member name='Max Mac Man' job='Co-Founder / CEO' src='https://kriesi.at/themes/enfold/files/2013/04/team-5.jpg' attachment='' description='Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. '] [av_team_icon title='Max on Behance' link='http://www.behance.net/' link_target='' icon='246'] [av_team_icon title='Max on Facebook' link='http://www.facebook.com/' link_target='' icon='214'] [av_team_icon title='All Blog Posts by Max' link='http://kriesi.at/themes/enfold/author/kriesi/' link_target='' icon='6'] [/av_team_member] [/av_one_half] [av_one_half] [av_team_member name='Alex Andrews' job='Co-Founder / CTO' src='https://kriesi.at/themes/enfold/files/2013/04/team-8.jpg' description='Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. '] [av_team_icon title='Alex on Behance' link='http://www.behance.net/' link_target='' icon='246'] [av_team_icon title='Alex on Facebook' link='http://www.facebook.com/' link_target='' icon='214'] [av_team_icon title='Alex on Twitter' link='http://www.twitter.com/' link_target='' icon='210'] [av_team_icon title='Alex on Google Plus' link='http://plus.google.com/' link_target='' icon='215'] [/av_team_member] [/av_one_half] [av_promobox button='yes' label='Contact Enfold' link='manually,#' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='large' icon_select='yes' icon='5'] Welcome! This is our dedicated Team. Did we say that we would love to work with you? So dont be shy, get in touch! [/av_promobox] [av_one_third first] [av_team_member name='Frank Furious' job='Art Director' src='https://kriesi.at/themes/enfold/files/2013/04/team-2-300x300.jpg' description='Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. <strong>Lorem ipsum dolor</strong> sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. '] [av_team_icon title='Frank on LinkedIn' link='http://www.linkedin.com/' link_target='' icon='221'] [av_team_icon title='Frank on Facebook' link='http://www.facebook.com/' link_target='' icon='214'] [/av_team_member] [/av_one_third] [av_one_third] [av_team_member name='Kara Kulis' job='Marketing & Sales' src='https://kriesi.at/themes/enfold/files/2013/04/team-3-300x300.jpg' description='Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. '] [av_team_icon title='kara on LinkedIn' link='http://www.linkedin.com/' link_target='' icon='221'] [av_team_icon title='Kara on Google Plus' link='http://plus.google.com/' link_target='' icon='215'] [/av_team_member] [/av_one_third][av_one_third] [av_team_member name='Andrea Arkov' job='Public Relations' src='https://kriesi.at/themes/enfold/files/2013/04/team-7-300x300.jpg' description='Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. '][/av_team_member] [/av_one_third][av_one_third first] [av_team_member name='Harold Houdini' job='Design' src='https://kriesi.at/themes/enfold/files/2013/04/team-4-300x300.jpg' description='Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. '] [av_team_icon title='Harold on Twitter' link='http://www.twitter.com/' link_target='' icon='210'] [av_team_icon title='Harold on Dribbble' link='http://www.dribbble.com/' link_target='' icon='223'] [/av_team_member] [/av_one_third] [av_one_third] [av_team_member name='Harra Halloy' job='Development' src='https://kriesi.at/themes/enfold/files/2013/04/team-9-300x300.jpg' description='Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. '] [av_team_icon title='Harra on Github' link='' link_target='' icon='204'] [/av_team_member] [/av_one_third] [av_one_third] [av_team_member name='Christian Cilinis' job='Development' src='https://kriesi.at/themes/enfold/files/2013/04/team-6-300x300.jpg' description='Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. '] [av_team_icon title='Chris on Github' link='' link_target='' icon='204'] [/av_team_member] [/av_one_third] [av_section color='socket_color' custom_bg='' src='https://kriesi.at/themes/enfold/files/2013/04/photodune-1011301-city-skyline-m1.jpg' position='center center' repeat='stretch' attach='fixed' padding='large' shadow='no-shadow'] [av_textblock ] <h2 style="text-align: center;">The Office</h2> <p style="text-align: center;">We recently moved the team to New York. Here is how it looks like if you work with us</p> [/av_textblock] [/av_section] [av_textblock] Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient <strong>montes</strong>, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. [/av_textblock] [av_one_half first] [av_image src='https://kriesi.at/themes/enfold/files/2013/04/photodune-1544662-interior-m-495x400.jpg' align='center' animation='left-to-right'] [/av_one_half] [av_one_half] [av_image src='https://kriesi.at/themes/enfold/files/2013/04/photodune-654147-presentation-m-495x400.jpg' align='center' animation='right-to-left'] [/av_one_half] [av_one_third first] [av_image src='https://kriesi.at/themes/enfold/files/2013/04/photodune-1524046-modern-office-m-300x200.jpg' align='center' animation='left-to-right'] [/av_one_third] [av_one_third] [av_image src='https://kriesi.at/themes/enfold/files/2013/04/photodune-215555-modern-interior-l-300x200.jpg' align='center' animation='bottom-to-top'] [/av_one_third] [av_one_third] [av_image src='https://kriesi.at/themes/enfold/files/2013/04/photodune-757323-living-room-m-300x200.jpg' align='center' animation='right-to-left'] [/av_one_third]If you need further assistance please let us know.
Best regards,
VictoriaHi, how do I reduce the font size for the header of the partner logo? So far I tried this. It does become italic, but this doesn’t affect the font size.
thanks for help/*partner logo*/
#top .avia-smallarrow-slider-heading {
font-style: italic !important;
font-size: 18px !important;
}
/* end partner logo*/In reply to: Button on easy slider not visible on mobile
Hey lindemarie,
Please try the following in Quick CSS under Enfold->General Styling to decrease the font size a bit on mobile:
@media only screen and (max-width: 767px) { .home .avia-caption-title { font-size:25px !important; } .home .avia-slideshow-button { font-size:18px !important; } }Best regards,
RikardIn reply to: Enfold 2017: grid 2 column post problem
Just solved the issue.
I can solve in 3 ways:
1) My choice: add this lines into CSS: it will resize the title size on smartphone and prevent the problem.
@media only screen and (max-width: 480px)
{
h3.slide-entry-title.entry-title { font-size:20px!important; }
}2) I don’t like so much the result but it works: split the 2 column into one on smartphone.
@media only screen and (max-width: 480px)
{
.flex_column { width: 100% !important; margin-left: 0 !important; }
}3) This works also but it need to download twice the contents: open the screen option and check into the two column grid list “hide on very small screen”; then create another list using single author big img and check everything except “hide on very small screen”.
Topic: Content Slider Question
Hi guys!
As usual, I am trying to create a pretty cool Content Slider with highly visible buttons. See here: https://argen-travel.com/test/
I created a Content Slider with image an text and would love to add big buttons like you see there that can take the visitor to either the next (or previous slide) or to a different post/page.
The post/page link is easy. My question is how do I indicate next slide (or previous slide) on the button?
This is the code I have right now on the Next Slide button but it does not take me to the next slide. :)
[av_button label='Next Slide' link='manually,#next' link_target='' size='large' position='left' icon_select='no' icon='ue800' font='entypo-fontello' color='theme-color' custom_bg='#444444' custom_font='#ffffff' admin_preview_bg='']
What should I enter here as the hyperlink?
Thank you so much!!
Warmly,
Havi
In reply to: Help with widget area
Hey hackoffseries,
Try adding this css code in Quick CSS (located in Enfold > General Styling):
.avia-builder-widget-area .widget_nav_menu .menu ul.sub-menu { padding: 0 0 0 13px !important; } .avia-builder-widget-area .widget_nav_menu .menu li a { color: #444; font-size: 12px; }just adjust the font size and color. Hope this helps :)
Best regards,
NikkoTopic: Help with widget area
Hi Enfold team!
I am using a custom widget on this page, to display a navigational menu (custom widget: services navigational menu: services)
How do I adjust the font size and font color of the navigational menu items?
Also, the items under “Facial Services” do not indent similar to the one’s under “Oral Services”
Thank you so much for your help!
Hi,
Please replace the current code with:
@media only screen and (max-width: 767px) { .cart_dropdown { height: 55px !important; width: 55px !important; right: -70px; } }Look for the following code in the style.css file and move it inside the css media query above.
.header_color .cart_dropdown_first .cart_dropdown_link { font-size: 25px; line-height: 55px; }Best regards,
IsmaelHi support,
I would like the blog – widgets (categories, recent posts, and tags) to have the same font-family, size, and color.
How is that possible?Thanks :-)
In reply to: Nowrap Special Heading Heading Text On Mobile
Hi Jas,
Can you try using this html code:
<div class="cities">New York · Kansas City · Los Angeles</div>then add this css code:
.cities { white-space: nowrap; } @media only screen and (max-width:767px) { .cities { margin-left: -7.5%; margin-right: -7.5%; font-size: 15px; } }Hope this helps.
Best regards,
NikkoIn reply to: responsive font problems…
so….
first of all, thanks so much everyone for chiming in :) it’s very very much appreciated :)we solved the issue :)
we added
h1 {
font-family: Lato !important;
font-size: 57px !important;
font-variant: normal;
font-weight: 900 !important;
line-height: 63px;
}
@media(max-width:480px){
h1{
font-size: 29px!important;
line-height: 32px ;
}
}
h2 {
font-family: Lato !important;
font-size: 46px !important;
font-variant: normal;
font-weight: 900!important;
line-height: 48px;
}
@media(max-width:480px){
h2{
font-size: 23px!important;
line-height: 24px ;
}
}
h3 {
font-family: Lato !important;
font-size: 37px !important;
font-variant: normal;
font-weight: 900!important;
line-height: 44px;
}
@media(max-width:480px){
h3{
font-size: 19px!important;
line-height: 22px ;
}
}
h4 {
font-family: Lato !important;
font-size: 23px !important;
font-variant: normal;
font-weight: 700!important;
line-height: 32px;
}
@media(max-width:480px){
h4{
font-size: 17px!important;
line-height: 23px ;
}
}
h5 {
font-family: Lato !important;
font-size: 15px !important;
font-variant: normal;
font-weight: 700!important;
line-height: 20px;
}
@media(max-width:480px){
h5{
font-size: 15px!important;
line-height: 20px ;
}
}
p {
font-family: Lato;
font-size: 17px;
font-style: normal;
font-variant: normal;
font-weight: 400!important;
line-height: 25px;
}
blockquote {
font-family: Lato;
font-size: 21px;
font-style: normal;
font-variant: normal;
font-weight: 400!important;
line-height: 30px;
}
pre {
font-family: Lato;
font-size: 13px;
font-style: normal;
font-variant: normal;
font-weight: 400!important;
line-height: 18.5667px;}
as well as adding in the call for all the font weights for lato in the header…
and that, as they say, was that :)
now everything finally works exactly how i wanted it :)
Hi there.
i have to do a relanauch of a website and my client wants the menu look exaclty the same as it was in the old webite.
How can i change only the fontstyle, font-size, menu-color, menu-hover, of the secondary menu? With the selector
.avia-menu-text the style of both of the menus changes, but i only want to change the style of the sec menu. I added an extra font via anyfont, that worked fine.the menu should have a small image on the right side of the menu items – how can i center it?
Please see the links in private content for a better explainthank you in advance
Katharina
