How to properly insert an image map? 
Author: ANASTASIA M.
Visited 1906,
Followers 1,
Shared 0
Hello,
We want to add an <img> <map> inside a text-element or html-element. The problem is that
everytime we try insert it, the height of the element (page cell) adds 650 empty pixels at
the bottom of the cell.
This is the code we use...
<img id="testmap" src="images/test.jpg" alt="" usemap="#testtop" />
<map name="testtop" id="testtop">
<area alt="" href="blog/index.php" shape="rect" coords="3,3,296,189" />
more <area> here...
...
</map>
if we add on the <img .... height="400px"> then the empty pixel disappear but on responsive design the image can't change height. So it appears streached.
Have anyone faced this problem?
X
Posted on the
I am not sure if you tested this, but i did not check your code, but check these settings:
The min. height is set in your template style, main template structure, page contents.
Also -if you use a HTML object- there are height adjustments and scrollbars setting in the below left corner in x5.
Together you should be able to get a good page.
Author
I will might try the min.height but as far we have more problems appear with the image map. It's very hard to handle the coordinates in responsive design. So we will try another approrach by using image sprites and not image maps. Sprites seems easier to handle on responsive design.
Thank you very much Andre
I can imagine it's difficult in responsive. Hope you succeed.
... @media (media query) >> idea >> https://helpcenter.websitex5.com/post/141655#7
... ciao