Skip to content

CSS module: hide code / add playground #38500

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Mar 7, 2025
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions files/en-us/web/css/css_shapes/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,9 @@ Shapes define geometries that can be used as CSS values. This module provides fu

## CSS shapes in action

The example below shows an image that has been floated left, and the `shape-outside` property applied with a value of `circle(50%)`. This creates a circle shape, and the content wrapping the float now wraps around that shape. This changes the length of the wrapping text's line boxes.
The example below shows an image that has been floated left, and the `shape-outside` property applied with a value of `circle(50%)`. This creates a circle shape, and the content wrapping the float now wraps around that shape. This changes the length of the wrapping text's line boxes. You can click "Play" to edit the code in the MDN Playground.

```html live-sample___circle
```html live-sample___circle hidden
<div class="box">
<img
alt="A hot air balloon"
Expand All @@ -38,7 +38,7 @@ The example below shows an image that has been floated left, and the `shape-outs
</div>
```

```css live-sample___circle
```css live-sample___circle hidden
body {
font: 1.2em / 1.5 sans-serif;
}
Expand Down