html - Turning Background Image within Div into a Link -
though there number of questions addressing turning background image link, or creating link within div, having difficulty find solution linking background image in div. specifically: https://jsfiddle.net/pmcgswf4/5/. ideally, when user selects either image or caption, should take them "personal_project_pages/crazyhearts.html".
thank you!
html:
<li> <div id="crazyhearts"> <div class="projects"> <h2><a href=personal_project_pages/crazyhearts.html class = "alpha"> crazy hearts cutting board </a></h2> </div> </div> </li> css:
/* projects */ .projects {border-style: solid; width: 99.5%; height: 100%; /** min-width: 630px; **/ min-height: 200px; } #crazyhearts { background:url("https://c1.staticflickr.com/5/4321/36112755175_f7f9ba8b84_b.jpg") no-repeat 0% 30%; background-size: cover; width: 100%; position: relative; } { color: #214e34; font-family: 'raleway', sans-serif; font-size: 13px; font-weight: 900; text-align: left; text-transform: uppercase; text-decoration: none; letter-spacing: 2px; } h2 { color: whitesmoke; font-family: 'orbitron', sans-serif; font-size: 28px; font-weight: 500; text-align: left; text-transform: uppercase; background-color: rgba(0, 0, 0, 0.9); }
<li> <div id="crazyhearts"> <a href="personal_project_pages/crazyhearts.html" class = "alpha"> <div class="projects"> <h2> crazy hearts cutting board </h2> </div> </a> </div> </li> you're missing " " around href attribute , html5 allows wrap tag
Comments
Post a Comment