Hyperlink on red background
I am currently working on a website where I have a very prominent error box with the colour #e20413
and text in #FFF
. However this, text contains two links that are blue and therefore not very readable.
What colour would normally be used for the hyperlink in these situations?
Example of current situation:
.alert {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
font-size: 12px;
margin-top: 10px;
}
.alert-danger {
color: #FFF;
background-color: #e20413;
border-color: #ebccd1;
}
<div class="alert alert-danger">
This is some text with a link to <a href="">some webpage</a> and some more text with another <a href="">link</a>!
</div>
.alert {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
font-size: 12px;
margin-top: 10px;
}
.alert-danger {
color: #FFF;
background-color: #e20413;
border-color: #ebccd1;
}
<div class="alert alert-danger">
This is some text with a link to <a href="">some webpage</a> and some more text with another <a href="">link</a>!
</div>
Visible in action: https://jsfiddle.net/kLxv8psg/