<!DOCTYPE html>
<meta charset="utf-8" />
<title>CSS Logical Properties: Flow-Relative Border Colors in Visited Links</title>
<link rel="author" title="Oriol Brufau" href="mailto:[email protected]" />
<link rel="help" href="https://drafts.csswg.org/css-logical/#border-color" />
<link rel="help" href="https://drafts.csswg.org/selectors/#visited-pseudo" />
<link rel="match" href="logical-box-border-color-visited-link-002-expected.html" />
<meta name="assert" content="This test checks that axis border shorthands set border color for visited links." />
<style>
a {
display: inline-block;
vertical-align: top;
border: 25px solid red;
}
#link1, #link2:visited {
border-block-color: green;
border-inline-color: green;
}
#link3 {
border-block: 25px solid green;
border-inline: 25px solid green;
}
#link4:visited {
/* :visited should honor the border color but ignore other values in the shorthand */
border-block: 0 none green;
border-inline: 0 none green;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<!-- Links point to current URL, which should be visited -->
<a id="link1" href=""></a><a id="link2" href=""></a><br />
<a id="link3" href=""></a><a id="link4" href=""></a>
Codebase Browser
chromium