My Courses > CustomizeWoo > Module 3 > Lesson 02: Google Chrome “Inspect”
Google Chrome “Inspect”
Google Chrome (and other browsers too) is your CSS friend. “Inspect” allows you to see every element’s CSS, so that you can customize it live and port it to your style.css
Video
Please note: English captions are enabled by default (click on “CC” in the video player to disable). Also, you can click on the “gear” icon to manage quality and playback speed. Enjoy!
Sorry, this video is visible to logged in and fully registered students only.
If you already enrolled in this course, please LOG IN
Otherwise, please enroll in the FREE / PRO COURSE
For any other queries, feel free to get in touch
If you already enrolled in this course, please LOG IN
Otherwise, please enroll in the FREE / PRO COURSE
For any other queries, feel free to get in touch
2 thoughts on “Google Chrome “Inspect””
Questions? Feedback? Support? Leave your comment now!
_____
_____
If you are writing code, please wrap it between: [php]code_here[/php]
Hello. I tried to make my product image sticky as on this page: https://www.kustomdesigns.com.au/?product=mx-jersey.
I used this CSS code:
.woocommerce div.product div.images.woocommerce-product-gallery { position: sticky; top: 0; }.
The problem is it works until the full product description starts overlapping the image. But I suppose it is possible that anything that’s full width below the product image could be pushed-up. Could you help me with a hint how to achieve this? Thank you!
Hi Marcel! I think you cannot achieve that with pure CSS, you need JavaScript instead/as well. If something is sticky it stays sticky in CSS, so this is not your best bet. Hope this helps!