iFrame / Seite in Pop-Up Fenster
Objekt als iFrame öffnen:
http://www.seite.de/?iframe=trueklickbare Telefonnummern
<a href="tel:+49151999999999">+49 (0)151/999 999 999</a>Custom Scroll Down Pfeil
Eigenen scroll down arrow + animationen stylen
/* Custom scroll down arrow*/
#top .scroll-down-link
{
width: 80px;
height: 80px;
margin-bottom: -20px;
background-image: url('XXX');
background-size: 100% auto;
}
#top .scroll-down-link:before
{
display: none;
}
#top .scroll-down-link
{
-webkit-animation: none;
animation: none;
}&-Zeichen
/* &-Zeichen */
.special_amp {
font-family: inherit;
font-style: inherit;
font-size: inherit;
line-height: inherit;
font-weight: bold;
color: inherit!important;
}Center align columns
Wichtig: ID= av-center-align-columns setzen
/* Center align columns inside color section*/
#av-center-align-columns .entry-content-wrapper {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
justify-content: center;
}Hintergrundbild mobile ausblenden
@media only screen and (max-width: 768px) {
#custom-ID { background-image: none!important; }}section with 100% content width
Volle Laufweite/Laufbreite für Container.
ID: section-container-width
/* Color section container width */
#section-container-width .container {
width: 100% !important;
min-width: 100%;
padding: 0;
margin: 0;
}Custom Springmarke
css um Element eine id zu geben. Man kann auch eine id in WP Enfold (erweiterter Layout Architekt) setzten: Element-Einstellungen > Erweitert > Entwickler Einstellungen
<div id="xxx"></div>Auf id verlinken um Sprungmarke / Scroll Link zu erzeugen.
<a href="https://www.Website.de/#xxx">Dieser Link scrollt zum Element mit der id "xxx"</a>Link underline
Strich unter Link entfernen
/* Links */
a:hover, a:focus, a:visited, #top .av_inherit_color a {
text-decoration: none !important;
}Sticky header on mobile
/* Sticky header on mobile */
@media only screen and (max-width: 767px) {
.responsive #top #main {
/* Margin top value should be equal to header height*/
margin-top: 80px;
}
.responsive #top #wrap_all #header {
position: fixed;
}
}Custom Buttons (Sprechblase)
Buttons in Form einer Sprechblase.
/* Custom buttons */
body div .avia-button
{
display: flex;
padding: 0;
border: none !important;
border-radius: 0 20px 20px 20px;
background-color: rgba(220,160,140,0);
justify-content: center;
align-items: center;
}