LocationContactPhone
  • StartNEU!
  • Portfolio
  • Kontakt
  • Datenschutz
  • Impressum
  • Click to open the search input field Click to open the search input field Suche
  • Menü Menü
Scroll to next section Scroll to next section

Buttons®

Du bist hier: Startseite1 / Buttons®

Styling Enfold Buttons

choose light-transparent layout on Enfold Dialog. All the rest will be ok to choose : small, middle, big, large etc. with icon or not

To have them besides each other – set the surrounding container to display: flex

/*** to have the buttons in a row - put them all in a 1/1 container and gave a unique custom-class to that 1/1 container ***/
                      /*** in this case i set : buttons-in-row as custom-class ***/

.buttons-in-row {
    display: flex !important;
    flex-flow: row wrap;
    justify-content: space-between;
}


.buttons-in-row::before, .buttons-in-row::after {
  display: none;
}
add to cart
add to cart
Webers Webdesign
+49 228 9768293

The styling code

* new button style - a bit glassy  */
.glass {
    position: relative;
    display: inline-block;
    border-radius: 4px;
    box-shadow: 1px 1px 4px #666;
    text-decoration: none;
    text-shadow: 1px 1px 2px #555;
    margin: 20px !important;
}
.glass:before{
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: calc(100% - 4px);
	height: 50%;
	background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2))
}

The styling code for different colors

/* the green one  */
.green {
	background-color: green; /*for compatibility with older browsers*/
	background-image: linear-gradient(green,lightgreen);
	color: #fff
}
.green:hover { background: linear-gradient(#073,#0fa) }

/* the blue one  */
.blue {
	background-color: #003968; /*for compatibility with older browsers*/
	background-image: linear-gradient(#003968,#0094ce);
	color: #fff
}
.blue:hover { background: linear-gradient(#047,#0ef) }

/* the red one  */
.red {
	background-color: red; /*for compatibility with older browsers*/
	background-image: linear-gradient(#ea0404 ,#6d0019);
	color: #fff
}
.red:hover { background: linear-gradient(#a00,#e00) }

To have the button effect now is to combine both classes to your button – first the style then the color f.e.  : glass red

info@guenterweber.com

custom-class in this example.  : verlauf-button

/*** same color-scheme : Light Transparent for the Enfold Button - then: ***/

.avia-button-wrap.verlauf-button,
.avia-button-wrap.verlauf-button .avia-button:before {
	display:inline-block;
	color: #fff;
	border-radius: 15px;
	background: linear-gradient(-45deg, #FFA63D, #FF3D77, #338AFF, #3CF0C5);
	background-size: 600%;
	animation: anime 16s linear infinite;
}

.avia-button-wrap.verlauf-button .avia-button:before {
	content:"";
	width: 100%;
	height: 100%;
	left: 5px;
	top: 5px;
	position: absolute;
	z-index: -1;
	filter: blur(10px);
	opacity: 0.7;
}

.avia-button-wrap.verlauf-button a,
.avia-button-wrap.verlauf-button a:hover {
  color: #fff;
  text-decoration: none
}

@keyframes anime {
	0% {background-position: 0% 50%}
	50% {background-position: 100% 50%}
	100% {background-position: 0% 50%}
}

I am Text – and blind

Far behind, behind the mountains of words, far from the countries vowels and consonants live the blind texts. Secluded they live in Lettercity on the coast of semantics, a large language ocean. A small stream called „Oxford Advanced Learner’s Dictionary of Current English“ flows through their village and provides them with the necessary rules. It’s a paradisiacal country where roasted sentences fly into your mouth. Not even the almighty punctuation dominates the blind texts – an almost unorthographic life. One day, however, a small line of blind text, her name was Lorem Ipsum, decided to go out into the wide grammar. The great Oxmox advised her against it, as it was swarming with evil commas, wild question marks and sneaky semicoli, but the blind text could not be misled.

He grabbed his seven capitals, put his initial in his belt and set off. When it had climbed the first hills of the Italic Mountains, it took a last look back at the skyline of its hometown of Lettercity, the headline of Alphabetvillage and the subline of its own street, the Linealley. A rhetorical question crossed his cheek in nostalgia, then it continued on its way.

On the way, it hit a copy. The copy warned the blind text where it came from, it would have been rewritten umpteen times and all that would remain of its origin would be the word „and“ and the blind text should turn back and return to its own safe country. But all the good talk didn’t convince him and so it didn’t take long until some insidious copywriters ambushed him, got him drunk with lunge and slogan and then dragged him to their agency, where they abused it again and again for their projects. And if it hasn’t been rewritten, you’re still using it. Far behind, behind the mountains of words, far from the countries vowels and consonants live the blind texts. Live in seclusion.

Far behind, behind the mountains of words, far from the countries vowels and consonants live the blind texts. Secluded they live in Lettercity on the coast of semantics, a large language ocean. A small stream called „Oxford Advanced Learner’s Dictionary of Current English“ flows through their village and provides them with the necessary rules. It’s a paradisiacal country where roasted sentences fly into your mouth. Not even the almighty punctuation dominates the blind texts – an almost unorthographic life. One day, however, a small line of blind text, her name was Lorem Ipsum, decided to go out into the wide grammar. The great Oxmox advised her against it, as it was swarming with evil commas, wild question marks and sneaky semicoli, but the blind text could not be misled.

He grabbed his seven capitals, put his initial in his belt and set off. When it had climbed the first hills of the Italic Mountains, it took a last look back at the skyline of its hometown of Lettercity, the headline of Alphabetvillage and the subline of its own street, the Linealley. A rhetorical question crossed his cheek in nostalgia, then it continued on its way.

On the way, it hit a copy. The copy warned the blind text where it came from, it would have been rewritten umpteen times and all that would remain of its origin would be the word „and“ and the blind text should turn back and return to its own safe country. But all the good talk didn’t convince him and so it didn’t take long until some insidious copywriters ambushed him, got him drunk with lunge and slogan and then dragged him to their agency, where they abused it again and again for their projects. And if it hasn’t been rewritten, you’re still using it. Far behind, behind the mountains of words, far from the countries vowels and consonants live the blind texts. Live in seclusion.

Live in seclusion.

info@guenterweber.com
add to cart

Haupt-Menü

  • Start
  • Portfolio
  • Kontakt
  • Datenschutz
  • Impressum

Latest Posts on Allgemein

  • gifs4. Mai 2022 - 12:21

Recent Posts Widget

  • Standard Post
  • Post with ACF
  • gifs
  • font usage
  • iframe lightbox
Beliebt
  • gifs4. Mai 2022 - 12:21
  • font usage26. Apr. 2022 - 8:10
  • Biergarten4. Juli 2019 - 21:13
  • Standard Post24. Apr. 2024 - 19:28
Kürzlich
  • Standard Post24. Apr. 2024 - 19:28
  • Post with ACF25. Nov. 2022 - 8:42
  • gifs4. Mai 2022 - 12:21
  • font usage26. Apr. 2022 - 8:10
Kommentare
  • Guenni007next one to have two comments13. Sep. 2024 - 7:38 von Guenni007
  • Guenni007one comment13. Sep. 2024 - 7:38 von Guenni007
  • Guenni007very nice to see12. Sep. 2024 - 9:40 von Guenni007
Schlagworte
abcdef ACF badge1 blue Fraunhofer Gif huawei instruction lightbox mobile Porsche portrait square webdesign

Webers Webdesign

Kontakt

Öffnet heute um 08:00 Uhr

Adresse

Webers Webdesign
Ludwig-Schopp-Straße 27
53117 Bonn

Anfahrt

Telefon

+ 49 228 9768293

Anrufen

E-Mail

info@guenterweber.com

E-Mail senden

You are currently viewing a placeholder content from Google Maps. To access the actual content, click the button below. Please note that doing so will share data with third-party providers.

More Information
Accept required service and unblock content
© 2025      Website Design by: Webers Webdesign
  • Link zu Facebook Link zu Facebook Link zu Facebook
  • Link zu X Link zu X Link zu X
  • Link zu Instagram Link zu Instagram Link zu Instagram
  • Datenschutzerklärung
  • Impressum
Nach oben scrollen Nach oben scrollen Nach oben scrollen