Extreme CSS Techniques - MadWorld Europe 2018, Scott DeLoach, ClickStart
0 likes47 views
The document outlines a presentation by Scott Deloach on expert-level CSS techniques, including the latest CSS features and their applications in MadCap Flare. It covers new CSS capabilities, tools for tracking development, and provides examples and resources for learning. Additionally, it includes information about Scott's background and how to access a sample project demonstrating the discussed techniques.
Extreme CSS Techniques - MadWorld Europe 2018, Scott DeLoach, ClickStart
- 1. © 2018 ClickStart – www.clickstart.net Extreme CSS Techniques Scott DeLoach – scott@clickstart.net ClickStart – www.clickstart.net In this presentation, I will demonstrate expert-level CSS techniques, including how to use future CSS features today. We will discuss what’s being developed in the latest CSS recommendations, what works now, and tricks that can be used to make next-level CSS work in MadCap Flare and in today’s browsers. Overview What’s new in CSS How to track CSS developments Examples Where to find cool CSS tricks Sample project What’s new in CSS? Inline CSS (HTML 5.2) ::grammar-error pseudo element ::spelling-error pseudo element :fullscreen (aka full-screen) pseudo class scroll-snap property calc() function @supports feature query variables How to track CSS developments Specifications w3.org/Style/CSS ishoudinireadyyet.com Browser support caniuse.com Examples I will demonstrate the following CSS features: @supports feature query ::before and ::after pseudo elements calc() function content with data attributes position:fixed for print targets transform property transition property variables
- 2. © 2018 ClickStart – www.clickstart.net Examples – adding features to Flare I will demonstrate the following Flare-specific CSS techniques: Condition tags – formatting tagged content in print targets Condition tags – popup tag labels in HTML5 targets Drop-downs and togglers – auto-hiding in print targets TopNav menu – animated hover underlining Variables and snippets – formatting in Flare’s XML Editor Where to find cool CSS examples General CSS tips/tricks and examples codepad.co codepen.com css-tricks.com cssdeck.com lea.verou.me littlesnippets.net w3schools.com/w3css Flare-specific forums.madcapsoftware.com/viewforum.php?f=6 madcapsoftware.com/blog madcapsoftware.com/resources/live-webinars.aspx Sample project I have created a sample project to demonstrate the CSS examples. You can download it at: goo.gl/YFCFkD About the presenter Scott DeLoach is the Founder of ClickStart, where he provides training and consulting for MadCap Flare, embedded user assistance, JavaScript/jQuery, CSS, and HTML5. He has been developing browser-based help systems for 20+ years, and he has received four Best in Show awards for his work from STC. Scott is a certified Flare and Doc-to-Help instructor, and he is the author of MadCap Flare 2018: The Definitive Guide, CSS to the Point, and HTML5 to the Point. For more information about Scott's books see www.lulu.com/clickstart. You can reach Scott at www.clickstart.net or by email at scott@clickstart.net.