Contrast Issue From Media Query
Contrast Issue With A Responsive Design Implementation
Try resizing the browser from 100% to about 30% and observe the foreground color, background color and size of the text below.
Make It Happen!
The point of this page is to demonstrate how a contrast issue can be introduced with CSS for a given range of screen widths. The text string "Make It Happen!" seen above should be very visible when the browser is at its full width. But when resized to a smaller width, the text is smaller and has different foreground and background colors that do not contrast well. This is an extreme example but it is possible that we could see more subtle variations of this issue when testing our clients' products.