Press enter to see results or esc to cancel.

Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Friday, September 11 2020

How to Fix the Horizontal Wiggle on iPhone Elementor Theme

Left and Right Wiggle on Elementor iPhone. Simple and Quick 3 Line Fix on CSS.

I was navigating one website built with elementor and I realized there is a left and right wiggle that was bothering me so much. So I found an article online all about it. Such a simple fix.  html, body { max-width: 100% !important;

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, June 25 2020

onClick Javascript Confirm Dialog Sample Code

How to popup a confirm dialog before deleting something?

How to create a confirm dialog to confirm the deletion.  <a href="url_to_delete" onclick="return confirm('Are you sure you want to delete this item?');">Delete</a>  

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, May 7 2020

Bootstrap 4 Align Center Div - Learn How to Align Middle

How to Center a div on the Middle. Middle Alignment for Bootstrap 4

A short snippet to align center columns on Bootstrap 4   <div class="col-md-6 align-self-center"> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat illo autem, consequatur, blanditiis aliquam, dolorem, in

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Saturday, March 21 2020

How to Change Select2 Box Height

Change Select2 JS Box Height with Simple CSS Snippets

This is a short code snippet on how to change the select2 box height plugin. Simple CSS code. .select2-selection__rendered { line-height: 31px !important; } .select2-container .select2-selection--single { height: 35px !important; }

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, March 5 2020

Bootstrap 4 How to Align Nav Bar Items to the Right

Simple Bootstrap 4 Align Right Snippet. Float your navigation to the right on bootstrap nav element.

This is a code snippet showing you how to align the nav items on bootstrap 4 to the right.  <div id="app" class="container"> <nav class="navbar navbar-toggleable-md navbar-light bg-faded"> <button class="navbar-toggler

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, February 27 2020

Nice Radio Button Toggles

A Sweet codepen toggle that can be used in your projects.

This is a nice codepen radio button i found that i used in one of my projects and i think it is nice to share.  HTML <form class="form"> <h2>Is this awesome?</h2> <div class="switch-field"> <input type="radio"

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, February 13 2020

How to Disable an href HTML CSS

Disable an href when you do not want it to be clicked.

How to disable href for a link.  <style> .disabled { pointer-events: none; cursor: default; } </style> <a href="somelink.html" class="disabled">Some link</a> You can also use

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Monday, December 2 2019

How to Setup Full Background Image on Framework7 Cordova

Full Background Image for Framework7 with Cordova.

This is a short snippet of CSS on how to put a full screen background image on your Framework7 Cordova App.  .page { font-family: "centabel"; background: url("../img/fondo.jpg") no-repeat center center fixed !important;

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, July 18 2019

How to Center the Google Recaptcha

A short code snippet to center google recaptcha on center of the screen.

A short snippet on how to center Recaptcha. This is a small snippet in order for you to center the recaptcha box in the center of the screen.  <style> /* already defined in bootstrap4 */ .text-xs-center { text-align:

Continue reading
Abraham Garcia Abraham Garcia in HTML/CSS Scripts   Thursday, May 30 2019

How to do Vertical Align Column in Bootstrap

Fastest method to align columns vertically on Boostrap 3. I spent hours finding a good solution for this and finally found it.

This is a Short CSS Snippet that will help you align columns vertically in the middle for whenever needed.  CSS .vertical-align { display: flex; flex-direction: row; } .vertical-align > [class^="col-"], .vertical-align >

Continue reading