Here is a simple code snippet that represents my actual code:
#myDiv {
background: black;
color:white;
float:left;
min-width:45px;
max-width:450px;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
#myDiv:hover:after {
width: inherit;
content: " This should resize my div. transitioning the new width.";
}<div id="myDiv">Here</div>I am looking for a workaround to solve an issue where selectors are elements apart in my code. Any help or suggestions using JavaScript or even jQuery (although I prefer avoiding heavy libraries) would be greatly appreciated.
If you want to see the actual code I'm working on, please leave a comment below and I will share it with you. Thank you!