v0rt.com

IE8 "hack" for nested featherlights

* * @file * Float clearing. * * Based on the micro clearfix hack by Nicolas Gallagher, with the :before * pseudo selector removed to allow normal top margin collapse. * * @see http://nicolasgallagher.com/micro-clearfix-hack

Compass will convert the font sizes from px to em and fit it into the vertical rhythm automatically with the necessary margin A neat trick, for sure. More on using the vertical rhythm properties and mixins: http://compass-style.org/reference/compass/typography/vertical_rhythm/ Note: The line height is relative to the constant $base-line-height. The number you specify for the leader, trailer and leading will be multiplied by the constant, then converted to its relative value in ems. Don’t worry about nested elements etc, Compass will do the maths for you :)

background-position: left top; /* End hack

! Force output of above line by adding a unicode character. ♫

TEMPORARY FIXES FOR DIVI CORE STYLING ISSUES

temporary fix for the Centered & Split headers hamburger icon alignment

temporary fix for the Default header hamburger icon alignment

END: TEMPORARY FIXES FOR DIVI CORE STYLING ISSUES

HTML5 ✰ Boilerplate * from https://github.com/verekia/initializr-template/blob/master/css/style.css * ==|== normalize ==========================================================

* ADOBE CONFIDENTIAL * * Copyright 2015 Adobe Systems Incorporated * All Rights Reserved. * * NOTICE: All information contained herein is, and remains * the property of Adobe Systems Incorporated and its suppliers, * if any. The intellectual and technical concepts contained * herein are proprietary to Adobe Systems Incorporated and its * suppliers and may be covered by U.S. and Foreign Patents, * patents in process, and are protected by trade secret or copyright law. * Dissemination of this information or reproduction of this material * is strictly forbidden unless prior written permission is obtained * from Adobe Systems Incorporated.

✅ overflow 방지

* DO NOT REMOVE THE Envato_ID LINE ABOVE - required for all theme updates. TF and self service.

Fixes a bug, not with thickness of the strikethrough line, but its position. (No, I have no idea why it works like that.)

Sticky table headers: the column labels of larger tables are 'sticky', and will remain visible when the reader scrolls through a large table, so they can see at a glance what each column contains. Implementation: This is supported natively in CSS by `position:sticky`. However, the naive use of sticky table headers is fragile and runs into many problems (eg disappearing borders <https://stackoverflow.com/questions/50361698/border-style-do-not-work-with-sticky-position-element>, overflows, or _z_-index bugs where the sticky header is *below* table elements). It works mostly in: tables in the base page, not in a collapse, not wider than the page, not in a blockquote, not in popups/popovers, etc. Because of the limited scope & many bugs, the naive approach was not worth implementing: small simple tables don't need it, while the large complex tables that do are relatively rare & would probably trigger bugs. So we implement them in a more complex way to work around bugs. To limit sticky issues, we only do sticky headers on 'large' tables where 'large' > 1 viewport height (ie. a table which would require scrolling). So the table becomes v-scrollable within an inner scroll container (set to be substantially smaller than the window size so there is plenty of room to click on and 'untrap' the mouse), like code-blocks on mobile. Within that scroll container, the headers are sticky. Since they are confined to the inner container and don't need to interact with any other page elements, most of the problems of sticky elements are avoided. Then other issues are dealt with by a bunch of small CSS tweaks.

Note that we do *not* need `ol { counter-reset: list-item; }`, although it would seem like we should. In fact, adding it causes bugs (namely, the `start` HTML list property stops working). (Why is this? It is a mystery.)

The iframe hack to cover selectlists in Internet Explorer <= v6

Remove the images for Internet Explorer <= v6 using the "* html" hack

inline-block is a hack to prevent margin collapsing

clearfix-hack

.related li.completed:before{ content:'✓'; }

* Why all the :is(*, #\#) prefixes? * * These components are embedded in who-knows-what sites with unpredictable CSS. * We need our styles to win against host page selectors like `.content p` or * `article a:hover` without using !important everywhere. * * The :is(*, #\#) trick adds ID-level specificity (0,1,0) without requiring * an actual ID in the DOM. Chaining it (2x or 3x) builds enough specificity * to beat most host selectors. * * The #\# is an escaped # character, creating an invalid-but-harmless ID * selector that never matches, but still contributes specificity via :is(). * * We also need these overrides to only affect the Component UI elements themselves. * Users can provide custom templates to the results and searchbox components, * and these must inherit their styles without having to fight ours. * * It's admittedly a bit of a hack but it does provide best effort styling consistency * for the Component UI out in the wild.