Picture link to another website not working HTML - html

Good day! I have this picture link but somehow its not linking when I click on the picture:
<div id="image-facebook" class="blok"> <a href="https://www.facebook.com/DePrael/"></a href></div>
Am I doing this right?

This should work
<div id="image-facebook" class="blok"> </div>

The href attribute specifies the URL of the page the link goes to.
you should write this
before
//<a href="https://www.facebook.com/DePrael/"></a href>
after
//

Related

href link working for one item but not for another

I have an index.html that includes:
<li>
<a href="imprint.html#imprint-link">
<div class="main-menu-title">IMPRINT</div>
</a>
</li>
When I click on this item another html file (imprint.html) is loaded, but when I click on Home, which includes the following code to go back to index.html, it doesn't work!
<a href="#index-link">
<div class="main-menu-title">HOME</div>
</a>
What is wrong here?
Update 1: When hovering the mouse over the link I get:
try using this code :
<a href="index.html">
<div class="main-menu-title">HOME</div>
</a>
inplace of :
<a href="#index-link">
<div class="main-menu-title">HOME</div>
</a>
To answer your original question.
What's wrong here?
As a couple kind folks already commented and one person already provided a nice solution, clicking on your original link
href="#index-link"
while you are on the imprint.html page will not take you to your index.html page. Why? Because
<a href="#index-link">
<div class="main-menu-title">HOME</div>
</a>
is saying, "Take me to an element on the current page (imprint.html) that has an ID of 'index-link'. If there is no element with and ID set to index-link, on the imprint.html page, nothing will happen. And, you will stay on the current page because you didn't specify an URL outside of the current page, which is still imprint.html.
So, with that current setup, you will not get to see index.html.

simple html anchor tag is not redirecting on click

It just HTML part of my PHP code which gives listing of products. I want the product image to be clickable which redirect to product detail page, but it seems that anchor tag is not working.
Here is my code:
<div class="container">
<div class="row">
<a href="/ProductUrl" class="grid-item"> //This code is basically under a loop which results in 6 products
<img src="/img1.jpg" alt="gem">
</a>
</div>
</div>
Right click the html document, view its page source, click the link of the href, check if its there. It might be in the wrong url.
#TheWell has given a good solution. Also you can give url like this,
<a href="../ProductUrl">

Apply Hyperlink to a CSS Created DIV

I need to figure out a way to have the Yellow Box <div id="bottom"> and the Text <div id="basket">SHOP NOW</div>link to google.com for example.
I have tried adding <div id="bottom">
</div> but nothing is working. It appears to skew the entire section when I add this syntax.
I have searched all over the place looking for an answer, I have read through almost all related StackOverflow articles and still can't figure out the correct way to do this.
Here is a link https://jsfiddle.net/sixpac/8p4m7oc2/8/ to my code.
Can someone point me in the right direction with this? Is this possible to complete without JavaScript? Thank you!
You are looking for something like this https://jsfiddle.net/8p4m7oc2/13/
<div id="bottom">
SHOP NOW
<div id="price">$70.00</div>
</div>
You can wrap the div element in an anchor element to have it link to your chosen url / file.
i.e.
<a href="www.google.com" class="fill-div">
<div id="bottom">
</div>
</a>
This should be the code:
https://jsfiddle.net/RreTH/
Edit:
This will make the whole div element link to google for linking just the text the should be enough to link only the text.
Simply change the basket div to <a>:
<a id="basket" href="http://www.google.com">SHOP NOW</a>

Redirect to a specific part of the page with a link

This is my link to the specific page from another page.
<a href="http://test.com/#test"
and this is my part of page I want to display but it does not work...
<div id="test"><h4>Title of test</h4></div>
I am using WordPress, could it cause the problem?
Change this:
<div id="test">
<h4>
Title of test
</h4>
</div>
to this...
<a name="test">
<h4>
Title of test
</h4>
</a>
You should be able to link to it with this:
Test
In HTML, you can jump to a specific page section by using an anchor tag with a name or id attribute, like:
<a id="test"><h4>Title of test</h4></a>
or
<a name="test"><h4>Title of test</h4></a>
Actually, it looks like name was only for HTML4, ID is what should be used for HTML5 per here:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-name

can I offset a bookmark inside a document/html?

I need to move all bookmarks inside the html page bit down. Is that doable?
something like that
<div class="anchordown" style="position:relative; top:-80px;">
<a name="learn">Learn bookmark</a>
</div>
but it doesn't work for me. The actual bookmark doesn't move at all
EDIT
I want to have the inside bookmark #learn to be displayed bit down not at the top of the page if I click so http://address/page.html#learn
Here is another alternative
<div class="anchordown">
<a name="learn" style="padding-top:80px;" >Learn bookmark</a>
</div>
You could try a margin or padding, like this:
<div class="anchordown" style="margin-top:80px;">
<a name="learn">Learn bookmark</a>
</div>