page looks crooked in Mozilla

A

ashkaan57

The web site in question is in two languages, one in English and the
other in Farsi
(Persian) which is a right-to-left language. The Farsi pages are mirror
images of the English, for example the menu is on the right, ...
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)
 
N

Neredbojias

To further the education of mankind, (e-mail address removed) vouchsafed:
The web site in question is in two languages, one in English and the
other in Farsi
(Persian) which is a right-to-left language. The Farsi pages are mirror
images of the English, for example the menu is on the right, ...
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)

Looks okay to me except for some kind of padding/margining problem at the
left of the Farsi version. You could maybe mirror-image the pic of the
book.
 
A

ashkaan57

Neredbojias said:
To further the education of mankind, (e-mail address removed) vouchsafed:


Looks okay to me except for some kind of padding/margining problem at the
left of the Farsi version. You could maybe mirror-image the pic of the
book.

Thanks for the reply Neredbojias. I did use mirror imaging on Farsi
pages. If you look at the top part of the page, you see that logo and
image are on the opposite side of the page, as compared to English
version.
One peculiar thing is the if I change the padding in the main_container
from 60px to 0, in IE the menu gets shifted to the right by 60px, it
almost falls off the image of the book, but in FF nothing happens; it
just stays where it is. (main_container is where the manu and content
are; it is the "parent" container. I listed the hierarchy in original
post.)

container1 (800px)
main_container (padding:0 60px 0 20px)
layout_table (relative)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,904
Latest member
HealthyVisionsCBDPrice

Latest Threads

Top