Issue
need help with this need to hyperlink both image with different links only one gets link secound one dosent
<html>
<head>
<style>
body {
**box-sizing: border-box;
float: left width:10%;
padding: 2px;
height: 800px**
}
</style>
</head>
<body>
<div id="banner" style="overflow: hidden; display: flex; justify-content: space-around;">
<div class="clm">
<p>
<a href="https://bigdunestours.com/desert-safari" target="_blank">
<img src="https://skylandtourism.com/wp-content/uploads/2018/03/Morning-Safari.jpg" alt="Picture1" style="width: 90%">
</div>
<div class="clm">
<p>
<a href="https://google.com" target="_self"></a>
<img src="https://skylandtourism.com/wp-content/uploads/2018/03/Morning-Safari.jpg" alt="Picture2" style="width: 90%">
</div>
</div>
<body>
<html>
need help pls
Solution
You want <a></a> tags to be wrapped around the elements you want to create hyperlink out of. So in this case the images should be wrapped in the a tags.
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@media (max-width: 640px) {
.banner {
flex-direction: column;
}
}
body {
margin: 0;
box-sizing: border-box;
min-height: 100vh;
min-width: 100vw;
}
.banner {
width: 100vw;
display: flex;
justify-content: space-around;
}
.clm {
margin: 2%;
display: flex;
justify-content: center;
align-items: center;
}
.clm img {
width: 100%;
}
</style>
</head>
<body>
<div class="banner">
<div class="clm">
<a href="https://bigdunestours.com/desert-safari" target="_blank">
<img src="https://skylandtourism.com/wp-content/uploads/2018/03/Morning-Safari.jpg" alt="Picture1" />
</a>
</div>
<div class="clm">
<a href="https://google.com" target="_self">
<img src="https://skylandtourism.com/wp-content/uploads/2018/03/Morning-Safari.jpg" alt="Picture2" />
</a>
</div>
</div>
<body>
<html>
Answered By - K450
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.