drmosko
drmosko

Reputation: 13

firefox display small box between images

try to diplay flags to change between languages, use images, in chrome all is good but in FFOX get a small box between images in the hebrew site?

I use this code:

 <div class="flags">
    <a href="http://www.drmosko.com/"> <img src="./images/english-flag.jpg"> </a>
    <a href="http://www.drmosko.com/he/"> <img src="./images/hebrew-flag.jpg"> </a>
 </div> 

link for good display : http://www.drmosko.com/

link for the problem : http://www.drmosko.com/he/

Upvotes: 0

Views: 38

Answers (3)

Splinteer
Splinteer

Reputation: 1264

Delete the space between both <a> and add a this line to your css:

.flags a{ margin-right: 5px; }

Upvotes: 0

Nitesh
Nitesh

Reputation: 15769

Your font does not understand space as blank and prints a character which is not understandable. Add an &nbsp; to resolve it.

For Instance,

<a href="http://www.drmosko.com/"> <img src="./images/english-flag.jpg"> </a>&nbsp;<a href="http://www.drmosko.com/he/"> <img src="./images/hebrew-flag.jpg"> </a>

Upvotes: 3

Richa
Richa

Reputation: 4270

try giving :

.flags { font-size: 0;}
.flags a { margin-right:5px;}

Upvotes: 0

Related Questions