html - a href link of an image not taking up full image size -
i have set 3 mini-features on index page whatever reason links show on top 20% of image on desktop version. when on mobile linkable area fine. site's core running off bootstrap.
<a href="courses.php" class="col-sm-4 fade-in two"> <img src="images/mini-features/book-your-private-lesson.jpg" alt="start private lessons, book class today universal ballroom" title="start private lessons, book class today universal ballroom" class="img-responsive"> </a> <a href="courses.php" class="col-sm-4 fade-in two"> <img src="images/mini-features/upcoming-studio-party.jpg" alt="upcoming event: april 14th, studio party @ universal ballroom in argyle illinois" title="upcoming event: april 14th, studio parth @ universal ballroom in argyle illinois" class="img-responsive"> </a> <a href="courses.php" class="col-sm-4 fade-in two"> <img src="images/mini-features/new-class-schedule.jpg" alt="get april class schedule, click here." title="get april class schedule, click here." class="img-responsive"> </a>
here link current development version of site:
http://sandbox.graphics/development/universal-ballroom/index.php
if inspect image developer tools recognize element (div.row
) in front of image.
by applying high z-index
-value can place image in front of other element (div.row
), , link work on whole image
css
a.col-sm-4.fade-in.two { z-index: 10000; }
Comments
Post a Comment