Page looks crooked in Mozilla

[ashkaan57]

The web site is in two languages, one in English and the other in Farsi
(Persian) which is a right-to-left language. So, I used two
stylesheets, with the same info, and changed the right and left
properties (i.e. the left-margin:20px in English version changed to
right-margin:20px in farsi version).
It works fine in IE in both languages. In Mozilla, the English version
works fine but the Farsi version looks crooked. the menu and everything
else is shifted to the left. I spent a couple of days trying to figure
out what is wrong and I can't (being new to CSS). I would GREATLY
appreciate any assistance.
I am not sure if this is appropriate or if it helps but here is the
structure of the pages using CSS (the indentations imply <div
id="header" is contained within <div id="container", ...):

English pages:

Container 800px, relative
Header (relative, 800x226)
Logo (absolute, 150x100, top:82, left:550)
key_visual (absolute, 437x127, top:82, left:86)

container1 (800px)
left_column
left_column_container (padding:0; margin:0)
main_nav_container (margin: 30px 0 0 0)
<Flash menu>
main_container (padding:0 20px 0 60px), relative
layout_table (relative)
right_column (500x475)
<aps_content_placeholder>
sub_container2 (padding:18 0 20 5px), 495
slogan (margin: 0 0 10px 0)
content_container (490px)

footer (800x120, margin:0, padding:0)
footer_line (margin:0 0 0 195) 500x40
footer_text (margin:10 0 0 25)

Farsi version:

container (800px, relative)
header (relative, 800x226)
logo (absolute, 437x127, top:82, left:86)
key_visual (absolute, 437x127, top:82, left:263)

container1 (800px)
main_container (padding:0 60px 0 20px)
layout_table (relative)
right_column (500x475)
<aps_content_placeholder>
sub_container2 (495px, padding:18 0 20 5)
slogan (padding: 0 0 10 0)
content_container (490px)

left_column
left_column_container
main_nav_container (margin: 30 12 0 0)
<menu>
Footer (800x120)
footer_line (margin:0 195 0 0) 500x40
footer_text (margin: 10 25 0 0)

The pages:
http://www.legalpersian.com/en/home.aspx (in English)
http://www.legalpersian.com/fa/home.aspx (in Farsi)

[Christian Kirsch]

Am 13.09.2006 19:45 schrieb as*******@hotmail.com:

The web site is in two languages, one in English and the other in Farsi
(Persian) which is a right-to-left language. So, I used two
stylesheets, with the same info, and changed the right and left
properties (i.e. the left-margin:20px in English version changed to
right-margin:20px in farsi version).
It works fine in IE in both languages. In Mozilla, the English version
works fine but the Farsi version looks crooked. the menu and everything
else is shifted to the left. I spent a couple of days trying to figure
out what is wrong and I can't (being new to CSS). I would GREATLY
appreciate any assistance.
I am not sure if this is appropriate or if it helps but here is the
structure of the pages using CSS (the indentations imply <div
id="header" is contained within <div id="container", ...):

....

The pages:
http://www.legalpersian.com/en/home.aspx (in English)
http://www.legalpersian.com/fa/home.aspx (in Farsi)

At least your Javascript seems to be buggy - I see +40 errors when you
page loads ("AniMenu_DoFSCommand is not defined" in some anonymous
function). The CSS does not validate. Try fixing the errors.

[ashkaan57]

Christian Kirsch wrote:

Am 13.09.2006 19:45 schrieb as*******@hotmail.com:

The web site is in two languages, one in English and the other in Farsi
(Persian) which is a right-to-left language. So, I used two
stylesheets, with the same info, and changed the right and left
properties (i.e. the left-margin:20px in English version changed to
right-margin:20px in farsi version).
It works fine in IE in both languages. In Mozilla, the English version
works fine but the Farsi version looks crooked. the menu and everything
else is shifted to the left. I spent a couple of days trying to figure
out what is wrong and I can't (being new to CSS). I would GREATLY
appreciate any assistance.
I am not sure if this is appropriate or if it helps but here is the
structure of the pages using CSS (the indentations imply <div
id="header" is contained within <div id="container", ...):

...

The pages:
http://www.legalpersian.com/en/home.aspx (in English)
http://www.legalpersian.com/fa/home.aspx (in Farsi)

At least your Javascript seems to be buggy - I see +40 errors when you
page loads ("AniMenu_DoFSCommand is not defined" in some anonymous
function). The CSS does not validate. Try fixing the errors.

Thanks for the reply Christian.
I open Firefox's Javascript console and then open the pages but don't
see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?

[Christian Kirsch]

Am 14.09.2006 16:24 schrieb as*******@hotmail.com:

Christian Kirsch wrote:

>Am 13.09.2006 19:45 schrieb as*******@hotmail.com:

>>The web site is in two languages, one in English and the other in Farsi
(Persian) which is a right-to-left language. So, I used two
stylesheets, with the same info, and changed the right and left
properties (i.e. the left-margin:20px in English version changed to
right-margin:20px in farsi version).
It works fine in IE in both languages. In Mozilla, the English version
works fine but the Farsi version looks crooked. the menu and everything
else is shifted to the left. I spent a couple of days trying to figure
out what is wrong and I can't (being new to CSS). I would GREATLY
appreciate any assistance.
I am not sure if this is appropriate or if it helps but here is the
structure of the pages using CSS (the indentations imply <div
id="header" is contained within <div id="container", ...):

...

>>The pages:
http://www.legalpersian.com/en/home.aspx (in English)
http://www.legalpersian.com/fa/home.aspx (in Farsi)

At least your Javascript seems to be buggy - I see +40 errors when you
page loads ("AniMenu_DoFSCommand is not defined" in some anonymous
function). The CSS does not validate. Try fixing the errors.

Thanks for the reply Christian.
I open Firefox's Javascript console and then open the pages but don't

Move your cursor over the menu (which doesn't show any text in the
farsi version). This gives Javascript errors.

see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?

As I said: The CSS does not *validate*. Use the validator at
http://jigsaw.w3.org/css-validator/
The Farsi version seems to be ok now (did you change anything),
there's still one warning in the english version, though.

[ashkaan57]

Christian Kirsch wrote:

Am 14.09.2006 16:24 schrieb as*******@hotmail.com:

Christian Kirsch wrote:

Am 13.09.2006 19:45 schrieb as*******@hotmail.com:
The web site is in two languages, one in English and the other in Farsi
(Persian) which is a right-to-left language. So, I used two
stylesheets, with the same info, and changed the right and left
properties (i.e. the left-margin:20px in English version changed to
right-margin:20px in farsi version).
It works fine in IE in both languages. In Mozilla, the English version
works fine but the Farsi version looks crooked. the menu and everything
else is shifted to the left. I spent a couple of days trying to figure
out what is wrong and I can't (being new to CSS). I would GREATLY
appreciate any assistance.
I am not sure if this is appropriate or if it helps but here is the
structure of the pages using CSS (the indentations imply <div
id="header" is contained within <div id="container", ...):

...
The pages:
http://www.legalpersian.com/en/home.aspx (in English)
http://www.legalpersian.com/fa/home.aspx (in Farsi)

At least your Javascript seems to be buggy - I see +40 errors when you
page loads ("AniMenu_DoFSCommand is not defined" in some anonymous
function). The CSS does not validate. Try fixing the errors.

Thanks for the reply Christian.
I open Firefox's Javascript console and then open the pages but don't

Move your cursor over the menu (which doesn't show any text in the
farsi version). This gives Javascript errors.

see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?

As I said: The CSS does not *validate*. Use the validator at
http://jigsaw.w3.org/css-validator/
The Farsi version seems to be ok now (did you change anything),
there's still one warning in the english version, though.

Hi Christian,
yes, I fixed the two errors on the CSS file in Farsi version of the
page; they validated. The warnings seem to be related to missing
'background-color'.
But I still can't see any javascript errors. When I go to
http://www.legalpersian.com/fa/home.aspx I see the menu and moving my
mouse over it does not display any errors. Also, I don't see any errors
on the javascript console. I tried it with Netscape 7.1, same thing:
crooked page but no errors.

[ashkaan57]

Christian Kirsch wrote:

Am 14.09.2006 16:24 schrieb as*******@hotmail.com:

Christian Kirsch wrote:

Am 13.09.2006 19:45 schrieb as*******@hotmail.com:
The web site is in two languages, one in English and the other in Farsi
(Persian) which is a right-to-left language. So, I used two
stylesheets, with the same info, and changed the right and left
properties (i.e. the left-margin:20px in English version changed to
right-margin:20px in farsi version).
It works fine in IE in both languages. In Mozilla, the English version
works fine but the Farsi version looks crooked. the menu and everything
else is shifted to the left. I spent a couple of days trying to figure
out what is wrong and I can't (being new to CSS). I would GREATLY
appreciate any assistance.
I am not sure if this is appropriate or if it helps but here is the
structure of the pages using CSS (the indentations imply <div
id="header" is contained within <div id="container", ...):

...
The pages:
http://www.legalpersian.com/en/home.aspx (in English)
http://www.legalpersian.com/fa/home.aspx (in Farsi)

At least your Javascript seems to be buggy - I see +40 errors when you
page loads ("AniMenu_DoFSCommand is not defined" in some anonymous
function). The CSS does not validate. Try fixing the errors.

Thanks for the reply Christian.
I open Firefox's Javascript console and then open the pages but don't

Move your cursor over the menu (which doesn't show any text in the
farsi version). This gives Javascript errors.

see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?

As I said: The CSS does not *validate*. Use the validator at
http://jigsaw.w3.org/css-validator/
The Farsi version seems to be ok now (did you change anything),
there's still one warning in the english version, though.

Hi Christian,
yes, I fixed the two errors on the CSS file in Farsi version of the
page; they validated. The warnings seem to be related to missing
'background-color'.
But I still can't see any javascript errors. When I go to
http://www.legalpersian.com/fa/home.aspx I see the menu and moving my
mouse over it does not display any errors. Also, I don't see any errors
on the javascript console. I tried it with Netscape 7.1, same thing:
crooked page but no errors.
Is it possible to send me the errors? I am not sure why you see the
errors and I don't.

[David Stone]

In article <11**********************@h48g2000cwc.googlegroups .com>,
as*******@hotmail.com wrote:

Christian Kirsch wrote:

[snip]

Move your cursor over the menu (which doesn't show any text in the
farsi version). This gives Javascript errors.

see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?

As I said: The CSS does not *validate*. Use the validator at
http://jigsaw.w3.org/css-validator/
The Farsi version seems to be ok now (did you change anything),
there's still one warning in the english version, though.

Hi Christian,
yes, I fixed the two errors on the CSS file in Farsi version of the
page; they validated. The warnings seem to be related to missing
'background-color'.
But I still can't see any javascript errors. When I go to
http://www.legalpersian.com/fa/home.aspx I see the menu and moving my
mouse over it does not display any errors. Also, I don't see any errors
on the javascript console. I tried it with Netscape 7.1, same thing:
crooked page but no errors.
Is it possible to send me the errors? I am not sure why you see the
errors and I don't.

I opened your page in Firefox 1.5, then opened the Javascript console,
and saw lots of errors. They appear to be related to the English page,
not the Farsi one.

I get:

Error: Error in parsing value for property 'font'. Declaration dropped.
Source File: http://www.legalpersian.com/en/assets/css/EngStyle.css
Line: 48

I'm not sure what you mean by "looking crooked" (slanted?), but there
does appear to be an alignment problem with the menu and text divs
relative to the book "edges" in the background image - is this what
you were referring to?

[ashkaan57]

David Stone wrote:

In article <11**********************@h48g2000cwc.googlegroups .com>,
as*******@hotmail.com wrote:

Christian Kirsch wrote:

[snip]

>
Move your cursor over the menu (which doesn't show any text in the
farsi version). This gives Javascript errors.
>
see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?
As I said: The CSS does not *validate*. Use the validator at
http://jigsaw.w3.org/css-validator/
The Farsi version seems to be ok now (did you change anything),
there's still one warning in the english version, though.

Hi Christian,
yes, I fixed the two errors on the CSS file in Farsi version of the
page; they validated. The warnings seem to be related to missing
'background-color'.
But I still can't see any javascript errors. When I go to
http://www.legalpersian.com/fa/home.aspx I see the menu and moving my
mouse over it does not display any errors. Also, I don't see any errors
on the javascript console. I tried it with Netscape 7.1, same thing:
crooked page but no errors.
Is it possible to send me the errors? I am not sure why you see the
errors and I don't.

I opened your page in Firefox 1.5, then opened the Javascript console,
and saw lots of errors. They appear to be related to the English page,
not the Farsi one.

I get:

Error: Error in parsing value for property 'font'. Declaration dropped.
Source File: http://www.legalpersian.com/en/assets/css/EngStyle.css
Line: 48

I'm not sure what you mean by "looking crooked" (slanted?), but there
does appear to be an alignment problem with the menu and text divs
relative to the book "edges" in the background image - is this what
you were referring to?

Hi Christian,
Yes, the mis-alignment is waht I was referring to. I fixed the error in
css file and ran it through validator and it went through.
I tried everything to get the mis-aligment working but to no avail. The
css for persian is exactly the same as ENglish except for sitching left
and right values (leftmargin changed to right-margin, etc.) and it
looks fine in IE. I really appreciate your help.

[David Stone]

In article <11**********************@e3g2000cwe.googlegroups. com>,
as*******@hotmail.com wrote:

David Stone wrote:

In article <11**********************@h48g2000cwc.googlegroups .com>,

[snip]

I'm not sure what you mean by "looking crooked" (slanted?), but there
does appear to be an alignment problem with the menu and text divs
relative to the book "edges" in the background image - is this what
you were referring to?

Hi Christian,
Yes, the mis-alignment is waht I was referring to. I fixed the error in
css file and ran it through validator and it went through.
I tried everything to get the mis-aligment working but to no avail. The
css for persian is exactly the same as ENglish except for sitching left
and right values (leftmargin changed to right-margin, etc.) and it
looks fine in IE. I really appreciate your help.

Not Christian, David.

There appear to be a number of common issues with IE vs FF when dealing
with images and tables. A google search on "looks different" should
pull up most of them! I'm guessing that your problem either arises from
one of these, or from an error in one of your px values for sizing and
spacing your divs, etc. that is worked around by IE but not FF.

[ashkaan57]

David Stone wrote:

In article <11**********************@e3g2000cwe.googlegroups. com>,
as*******@hotmail.com wrote:

David Stone wrote:

In article <11**********************@h48g2000cwc.googlegroups .com>,

[snip]

>
I'm not sure what you mean by "looking crooked" (slanted?), but there
does appear to be an alignment problem with the menu and text divs
relative to the book "edges" in the background image - is this what
you were referring to?

Hi Christian,
Yes, the mis-alignment is waht I was referring to. I fixed the error in
css file and ran it through validator and it went through.
I tried everything to get the mis-aligment working but to no avail. The
css for persian is exactly the same as ENglish except for sitching left
and right values (leftmargin changed to right-margin, etc.) and it
looks fine in IE. I really appreciate your help.

Not Christian, David.

There appear to be a number of common issues with IE vs FF when dealing
with images and tables. A google search on "looks different" should
pull up most of them! I'm guessing that your problem either arises from
one of these, or from an error in one of your px values for sizing and
spacing your divs, etc. that is worked around by IE but not FF.

Thanks David. I did a search and found a lot of links, some of them
discussing the same problems. I tired the suggestions but no change. I
even modified the web.config file for my ASP application to prevent
Firefox being taken as a down-level browser, it didn't help either. I
tried to modify all the margin and padding settings, ...

[ashkaan57]

as*******@hotmail.com wrote:

David Stone wrote:

In article <11**********************@h48g2000cwc.googlegroups .com>,
as*******@hotmail.com wrote:

Christian Kirsch wrote:

[snip]

Move your cursor over the menu (which doesn't show any text in the
farsi version). This gives Javascript errors.

see any errors. Also, when I open the pages, they don;t pop up any
errors. How did you manage to have the errors listed?
As I said: The CSS does not *validate*. Use the validator at
http://jigsaw.w3.org/css-validator/
The Farsi version seems to be ok now (did you change anything),
there's still one warning in the english version, though.
Hi Christian,
yes, I fixed the two errors on the CSS file in Farsi version of the
page; they validated. The warnings seem to be related to missing
'background-color'.
But I still can't see any javascript errors. When I go to
http://www.legalpersian.com/fa/home.aspx I see the menu and moving my
mouse over it does not display any errors. Also, I don't see any errors
on the javascript console. I tried it with Netscape 7.1, same thing:
crooked page but no errors.
Is it possible to send me the errors? I am not sure why you see the
errors and I don't.

I opened your page in Firefox 1.5, then opened the Javascript console,
and saw lots of errors. They appear to be related to the English page,
not the Farsi one.

I get:

Error: Error in parsing value for property 'font'. Declaration dropped.
Source File: http://www.legalpersian.com/en/assets/css/EngStyle.css
Line: 48

I'm not sure what you mean by "looking crooked" (slanted?), but there
does appear to be an alignment problem with the menu and text divs
relative to the book "edges" in the background image - is this what
you were referring to?

Hi Christian,
Yes, the mis-alignment is waht I was referring to. I fixed the error in
css file and ran it through validator and it went through.
I tried everything to get the mis-aligment working but to no avail. The
css for persian is exactly the same as ENglish except for sitching left
and right values (leftmargin changed to right-margin, etc.) and it
looks fine in IE. I really appreciate your help.

Hi,
I found that if I change the padding in main_container (in Farsi
version) from (0 60px 0 20px) to (0 0 0 20px), in IE the menu gets
pushed to the right 60px but nothing changes in FF.