کمک در طراحی فرم

برای طراحی یه فرم که وسط صفحه باشه و فیلد های نوشتنی اون همه از سمت راست فرم به یه اندازه فاصله داشته باشن از HTML+CSS زیر استفاده میکنم:

کد:

---

HTML:
<div id="frm">
<form>
<label>نام: </label><input type="text" /><br />
<label>نام خانوادگي: </label><input type="text" /><br />
<input type="submit" />
</form>
</div>
 
CSS:
body{
  direction: rtl;
}
#frm{
  margin: auto;
  width: 400px;
  border: 1px black solid;
}
form label{
  position: absolute;
}
form input{
  margin-right: 8em;
}

---

تو ie,firefox خوبه ولی تو opera,chrome مشکل داره، نوشته های label فارسی از راست میرنن بیرون و حاشیه ی input ها هم اعمال نمیشه. نمیدونم چرا اینجوریه.
سایت باید تا هفته ی دیگه کار کنه ممنون میشم سریع کمک کنید مشکلم حل شه.
مرسی

چون از em استفاده کردید.
گوگل کروم em رو نمیشناسه. از px استفاده کنید.

ممنون از جوابتون ولی مشکلم تو اپرا حل نشد. هنوز همونطوری هست. تو کروم تست میکنم بعدا نتیجه رو میگم.
تو اپرا به جای اینکه input ها با اضافه کردن margin بیان راست، نوشته های label میان سمت input ها! label ها هم که کلان بیرون از فرم هستن! مرز گذاشتم که کاملا معلوم شه...

ویرایش: فهمیدم چرا اینجوریه. وقتی rtl میکنی چپ و راست توی opera عوض میشه! باید حاشیه ی چپ هم بدم ولی همه چی به هم میریزه!
اصولا برای این کار از چه راهی استفاده میشه؟ اصلا این کار من استاندارد هست؟ با دارم خرکاری میکنم؟

لیبل ها چرا absolute هستند؟ همین میتونه باعث به هم ریختگی صفحه بشه

اگه لیبل ها absolute نباشن Margin ها نسبت به لیبل ها اعمال میشن و text ها از راست به یه فاصله نخواهند بود.

حدودا مشکل رو حل کردم. فعلا تو ie,firefox,opera خوبه تو کروم هم بعد از تست اطلاع میدم(داره دانلود میشه)..
کلا اینجوری کردم:

کد:

---

کد html:
<div id="frm">
<form>
<label>نام: </label><input type="text" /><br />
<label>نام خانوادگي: </label><input type="text" /><br />
<input type="submit" />
</form>
</div>

کدcss:
body{
  direction: rtl;
}
#frm{
  margin: auto;
  width: 400px;
  border: 1px black solid;
}

form label{
  position: absolute;
}
form input{
  margin-left: 150px;
  margin-right: 100px;
}

---

که حاشیه ی چپ ماله اپرا هست... چقدر این اپرا اعصاب خوردکن شده بود واسم (دی)!

محض اطلاع دوستان میگم: کروم em رو میشناسه.... تست کردم جواب داده....
بالاخره درستش کردم... تو هر چهارتا مرورگر خوبه...
باید absolute رو برمیداشتم عوضش text ها رو به صورت relative میاوردم بالا که خوب بشه... با اینکه به قشنگی قبل نیست بازم خوبه(دی!)
چقدر این فرق های کوچیک اعصاب خوردکن هستن!

نقل قول:

---

نوشته شده توسط thelastblack [ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]

محض اطلاع دوستان میگم: کروم em رو میشناسه.... تست کردم جواب داده....
بالاخره درستش کردم... تو هر چهارتا مرورگر خوبه...
باید absolute رو برمیداشتم عوضش text ها رو به صورت relative میاوردم بالا که خوب بشه... با اینکه به قشنگی قبل نیست بازم خوبه(دی!)
چقدر این فرق های کوچیک اعصاب خوردکن هستن!

---

تو سایت jot form اگه عضو بشی به صورت راحتی می تونی کد ها رو بدست بیاری (نوشتن کد توی بیشتر کشور ها منسوخ شده و بیشتر از generator ها استفاده میکنند.)
برو به سایت

کد:

---

www.jotform.com

---