Skip to content

Instantly share code, notes, and snippets.

@ScottDeLuzio
Created March 3, 2016 22:49
Show Gist options
  • Save ScottDeLuzio/944684cb8f1967e8d125 to your computer and use it in GitHub Desktop.
Save ScottDeLuzio/944684cb8f1967e8d125 to your computer and use it in GitHub Desktop.
Widget Hover Text on Mobile
/* Resize hover text area for screen sizes smaller than 480px wide. Repeat for other screen sizes as needed */
@media only screen and (max-width: 480px) {
.hover-text {
width: 261px;
height: 192px;
display: none;
margin-top: -201px;
margin-left: 13px;
}
.widget-4:focus .hover-text {
background: #000;
opacity: 0.75;
color: #fff;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment