you need a position that isn’t static (the default)
ex:
position: relative;
z-index: 100;
css
so. you need to make the owl carousel fade in and out instead of swiping.
THIS IS NOT BUILT IN TO A STANDARD OWL-CAROUSEL FEATURE.
Find the animation you want in the animate.css library. Choose the in and out versions of the animation you want.
Add a property name to your slider describing the transition.
transitionStyle :"Fade",
Rename your animation in this style:
owl-Fade-in, owl-Fade-out
Big thanks to:
http://www.landmarkmlp.com/js-plugin/owl.carousel/demos/transitions.html
font awesome 5 makes pseudo elements hard
You need to set the font-weight to 900 for no freaking reason .
https://stackoverflow.com/questions/47712987/font-awesome-5-on-pseudo-elements
using fontawesome in pseudoelements
the .css file will be sufficient for font-family
i actually used CSS calc() in a real thing
so the input box has padding so the text inside of it isn’t right up against the box. in order to get the width of the dropdown menu to match the width of the input bar exactly, you have to add padding.
but when you add padding to the dropdown menu, the highlight doesn’t go all the way across.
SO you use calc(100% + 30px) to account for the 15px on either side of the input. BOOM.
CSS grid grab and go layouts
the fr unit
“The fr unit (a “fraction”) can be used when defining grids like any other CSS length such as %, px or em” (https://css-tricks.com/introduction-fr-css-unit/)
…(holy shit CSS grid is amazing)
Solutions 