Link: http://mallorca-attraction-tickets.com/product/test-2/ The site is built on wordpress with elementor and woocommerce and uses the plugin "Twist" to display the woocommerce gallery pictures in a slideshow. The height of the slides has been reduced to 400px using this css .twist-pgs…
What I tried to achieve is make elements center in div with sticky-top class, I used these class to get this but no success: d-flex justify-content-center align-items-center flex-column body, html { height: 100%; } #element-1 { background: lightgray; height: 1000px;…
the first one works but I am unable to change the color of the second (.fa ). I am able to change the font color while not active. #pgggo-sort-filter ul li label input[type="checkbox"]:checked ~ .icon-box{ background: green; /* padding: 10px;…
So I'm trying to center my green divs vertically which are the ones with the class myCol by using align-items-center on the parent row but it's not centering it and I have no idea why. Why does it behave like…
I have two bootstrap columns, One has a form, another has image. The image division is set to 100% width, Which when resizing the screen, gets responsive. But the form stands to be in same height irrespective of screen size.…
Can anyone tell me why the colour of "Slewing Rings" is not in red whilst the background colour is indeed in yellow? I'm sure I'm doing something incredibly stupid... but it is beyond me as to what it could be.…
I am I would like to shorten the "underline" in the Elementor header menu of my Wordpress website: Shortening of header underline - screenshot I used this code to achieve this (I copied it from somewhere else): . elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed)…
Trying to figure out how to do this with plain javascript and css, below is code working with jquery. In this example a user clicks a link, the script checks to see if there is content in a div, if…
I have two questions I seek your help with: I am trying to remove the grey border using CSS but can't seem to remove it. My code is: <p class="product woocommerce add_to_cart_inline " style="border:4px solid #ccc; padding: 12px;"> <span class="woocommerce-Price-amount…
I would like to get a form layout like below https://jsfiddle.net/May_Y/6w9nd73c/20/ <form id="cat_select" class="form-inline"> <input class="c" name="c" id="c" type="text" style="width:10%"><br><br> Select any below:<br><br> <input class="l0" name="l0" id="l0" type="text" style="width:30%"> <input class="l1" name="l1" id="l1" type="text" style="width:30%"> <input class="l2" name="l2" id="l2" type="text"…