W3C home > Mailing lists > Public > public-css-archive@w3.org > October 2019

Re: [csswg-drafts] [css-content] Description about <content-replacement> doesn't match what implementations do for pseudo-elements (#2657)

From: Timothy Guan-tin Chien via GitHub <sysbot+gh@w3.org>
Date: Tue, 08 Oct 2019 23:06:18 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-539740834-1570575977-sysbot+gh@w3.org>
The note [here](https://drafts.csswg.org/css-content-3/#typedef-content-content-replacement) states:

> Note: Replaced elements use different layout rules than normal elements. (In effect, it becomes equivalent to an HTML &lt;img&gt; element.)

However the size of SVG can be different if I do this:

```html
<style>

.container {
    width: 200px;
    height: 200px;
    border: 1px solid red;
}

#first::after {
    content: url(image.svg);
}

#first::after,
.container > img {
    display: block;
    width: 50px;
    height: 50px;
}

</style>

<div class="container" id="first">
</div>

<div class="container">
    <img src="image.svg">
</div>
```

when `image.svg` comes with `width` and `height`:

```svg
<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <circle cx="50" cy="50" r="50"/>
</svg>
```

<img width="218" alt="image" src="https://user-images.githubusercontent.com/93093/66439732-70c12700-e9e5-11e9-9d05-7064a4b61475.png">



-- 
GitHub Notification of comment by timdream
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2657#issuecomment-539740834 using your GitHub account
Received on Tuesday, 8 October 2019 23:06:19 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:54 UTC