Firefox CSS problem with hebrew (works ok on IE)

Discussion in 'CSS' started by offco, Aug 4, 2006.

0
  1. #1
    Hello,
    Im building a webiste and i run into a problem with some css code that only seems to be working fine on IE.


    First let me give a simple example of what im doing. its a simple list arranged horizontically:


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1255">
<style type="text/css">
#menu{
border-top: 2px solid #000000;border-bottom: 2px solid #000000;
padding:4px;
text-align: right;
}
#menu ul {
margin: 0px;
padding: 0px;
}
#menu li {
display: inline;
padding: 0px 20px 0px 0px;
}
</style>
</head>
<body>
<div id="menu">
<ul>
<li>One</li>
<li>Two</li>
<li>three</li>
<li>Four</li>
<li>Five</li>
</ul>
</div>
</body>
</html>
    Code (markup):
    i use a 20px padding to the right of each <li> entry to add space between the items of the list.

    As soon as i change the <li> items to hebrew i lose the 20px paddin. instead of having a 20px space between each list entry i get the whole 100px (5 times 20px) to the before the first item with no space between the items.

    This problem only occurs when i use FF. on IE it works fine.

    Im adding screen caps as well.
    http://img394.imageshack.us/my.php?image=examplefx4.gif

    please help me with my problem, thank you all
     
    offco, Aug 4, 2006 IP
  2. NetMidWest

    NetMidWest Peon

    Messages:
    1,677
    Likes Received:
    151
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Try putting them all on one line, like this:
    <li>One</li><li>Two</li><li>three</li>...
    It worked for me for a similar problem.
     
    NetMidWest, Aug 4, 2006 IP
  3. offco

    offco Guest

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    thanks for the quick response Midwest!

    i tried what you suggested, but the only thing it did was take out even the one space between each list entry. i still get the same problem though.. all 50px (of the 5x10px paddings) appear BEFORE the first entry
     
    offco, Aug 4, 2006 IP
  4. NetMidWest

    NetMidWest Peon

    Messages:
    1,677
    Likes Received:
    151
    Best Answers:
    0
    Trophy Points:
    0
    #4
    It could be a language or character spacing bug. I don't know.

    You could try:

    #menu li {
display: inline;
padding-right:20px;
}
    Code (markup):
    in your css. :confused:
     
    NetMidWest, Aug 4, 2006 IP
  5. offco

    offco Guest

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    its a bug allright... but not in the 1255 language set. it must be a firefox bug as its working perfectly on IE. a bit disappointing i must admit. i did try the padding-right but it didnt make any difference.

    Ill try the UTF-8 Charset see how that goes...
     
    offco, Aug 4, 2006 IP
  6. offco

    offco Guest

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    i tried it now on Opera as well, both 1255 and utf-8 working fine.
     
    offco, Aug 4, 2006 IP
  7. FeelLikeANut

    FeelLikeANut Peon

    Messages:
    330
    Likes Received:
    19
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Remember, declaring that your HTML document is windows-1255 is good only if that is how you actually saved the document when it was created. Notepad, for instance, only allows you to save in ASCII, Unicode, or UTF-8. You would need a more advanced text editor to actually save the document as windows-1255.
     
    FeelLikeANut, Aug 4, 2006 IP
  8. offco

    offco Guest

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #8
    i did not know that... but my text editor lets me save the file as HTML, so that should be ok right?


    and just in case anyone would be willing to try it, here is the code with the hebrew fonts:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1255">
<style type="text/css">
#menu{
border-top: 2px solid #000000;border-bottom: 2px solid #000000;
padding:4px;
text-align: right;
}
#menu ul {
margin: 0px;
padding: 0px;
}
#menu li {
display: inline;
padding: 0px 20px 0px 0px;
}
</style>
</head>
<body>
<div id="menu">
<ul>
<li>אחת</li>
<li>שתיים</li>
<li>שלוש</li>
<li>ארבע</li>
<li>חמש</li>
</ul>
</div>
</body>
</html>
    Code (markup):
     
    offco, Aug 5, 2006 IP