Files
eepp/bin/unit_tests/assets/html/image_width_3.html
Martín Lucas Golini 288950bf34 Image sizing fixes.
Added support for `:where` and `:is`.
2026-06-05 00:18:26 -03:00

210 lines
4.3 KiB
HTML

<!doctype html>
<html>
<head>
<style>
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
html {
font-family: -apple-system, "SF Pro Text", Helvetica, sans-serif;
font-size: 62.5%;
font-synthesis: none;
}
body {
font-size: 1.7rem;
font-weight: 400;
line-height: 1.52947;
letter-spacing: -0.021rem;
background-color: hsl(203.6, 100%, 12%);
background-color: var(--content-background-color);
color: hsl(0, 0%, 20%);
color: var(--text-color);
}
main {
background-color: hsl(0, 0%, 96.9%);
background-color: var(--content-background-color);
}
.page-width {
max-width: 1140px;
margin: 0 auto;
}
main {
width: 100vw;
max-width: 100%;
overflow-x: hidden;
box-sizing: border-box;
padding: 3rem 0 0;
}
article {
padding-bottom: 3rem;
}
article::after {
clear: both;
content: " ";
display: table;
}
article p,
article div > img,
article pre,
article hr {
margin-bottom: 3rem;
}
article .aligncenter {
clear: both;
display: block;
margin: 0 auto 3rem;
}
article,
.feature-status-page {
-webkit-animation: fade-in-move-down 0.7s;
animation: fade-in-move-down 0.7s;
}
:where(body) {
margin: 0;
}
body {
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
:root {
--wp-block-synced-color: #7a00df;
--wp-block-synced-color--rgb: 122, 0, 223;
--wp-bound-block-color: var(--wp-block-synced-color);
--wp-editor-canvas-background: #ddd;
--wp-admin-theme-color: #007cba;
--wp-admin-theme-color--rgb: 0, 124, 186;
--wp-admin-theme-color-darker-10: #006ba1;
--wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
--wp-admin-theme-color-darker-20: #005a87;
--wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
--wp-admin-border-width-focus: 2px;
}
:root {
--wp--preset--font-size--normal: 16px;
--wp--preset--font-size--huge: 42px;
}
.aligncenter {
clear: both;
}
html :where(img[class*="wp-image-"]) {
height: auto;
max-width: 100%;
}
</style>
</head>
<body
class="wp-singular post-template-default single single-post postid-17333 single-format-standard wp-theme-webkit"
>
<main id="content">
<div class="page-width">
<article
class="post-17333 post type-post status-publish format-standard hentry category-news"
id="post-17333"
>
<p>
<img
src="image_width_3.webp"
alt="Cards on a webpage, scrolled into the viewport, completing their animation (turning to land flat), as they reach 50%."
width="2560"
height="1436"
class="aligncenter size-full wp-image-17031 preserve-color"
/>
</p>
</article>
</div>
</main>
</body>
</html>