Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- # 3 hidden CSS tips
- **1\. Use empty-cells to style table empty cells:**
- Surprisingly the browser support is quite good and extends back to IE8.
- Convenient to give less visual predominance to empty cells.
- ```css
- table {
- empty-cells: hide;
- }
- ```
- **2\. border-radius can be made non-symmetric:**
- In short you can define the horizontal and vertical radius independently.
- This gives room for interesting shapes. The left part of the slash is the horizontal radius, the right part is the vertical radius.
- ```css
- .custom-round {
- border-radius: 15px 15px 15px 10px / 5px 5px 20px 5px;
- }
- ```
- **3\. Use pseudo-elements to style the first letter and line:**
- No need to resort to another element to wrap the first letter or line of a `<p>` to style them differently:
- ```css
- p::first-letter {
- font-size: 2rem;
- }
- p::first-line {
- font-weight: 600;
- }
- ```
Add Comment
Please, Sign In to add comment