For an example, please visit https://jsfiddle.net/x7znc405/1/
If the HTML structure is as follows:
<div id="wrapper">
<a>
<div id="content">
Hello World
</div>
</a>
</div>
Here's the CSS styling:
#content {
background-color: blue;
width: 100%;
height: 100%
}
a {
width: auto;
height: auto;
}
#wrapper {
display: inline-block;
height: 39px;
width: 200px;
}
The a tag seems to not expand to fill its parent div, although it functions properly when clicked on in a browser.
This issue requires the use of force:true in Cypress to make the tag clickable, potentially causing problems if the tag is actually invisible.
Is there any method to have the a element grow to match the size of its parent div?