چطور می تونم حداقل ارتفاع این تگ رو برابر با اندازه مانیتور قرار بدم؟

i-php-i · May 12, 2011

چطور (بدون استفاده از جاوا اسکریپت) می تونم ارتفاع تگ با آی دیlayer_1 رو برابر با اندازه مانیتور قرار بدم؟ در صورتی که طول محتویات تگ از ارتفاع صفحه مانیتور بیشتر شد، ارتفاع تگ هم افزایش پیدا کنه.

سوال دیگه اینکه چرا خاصیت height:100% هیچ تاثیری روی ظاهر صفحه نداره؟

کد:

body { margin:0; padding:0; font:12px Tahoma, Geneva, sans-serif; background-color:#eee; }
[B][COLOR=Blue]
#layer_1 {width:1024px; margin:0 auto; background-color:#FFF; height:100%; }[/COLOR][/B]

#layer_2 { direction:rtl; width:400px; margin:70px auto; border:1px inset #999; padding:25px; background:#e1e1e1 url(../pic/tamplate/b1.jpg) repeat; height:150px; overflow:hidden; }

miladyazdan · May 12, 2011

لطفا بفرمایید این آی دی مربوط به چه تگی است.

احتمالا شما این تگ را توسط تگ دیگری محدود کرده اید و وقتی از درصد استفاده می کنید مقدار مورد نظر نسبت به تگ اصلی(محدود کننده )سنجیده می شود.

در صورت تمایل کد را به صورت کامل قرا دهید.

i-php-i · May 13, 2011

miladyazdan گفت:
لطفا بفرمایید این آی دی مربوط به چه تگی است.

احتمالا شما این تگ را توسط تگ دیگری محدود کرده اید و وقتی از درصد استفاده می کنید مقدار مورد نظر نسبت به تگ اصلی(محدود کننده )سنجیده می شود.

در صورت تمایل کد را به صورت کامل قرا دهید.

من یه فرم ورود دارم، فرم رو طوری طراحی کردم که وقتی از رزیولیشن هایی که استفاده کنم که دارای پهنایی بیشتر از 1024 پیکسل هستن، اطراف صفحه به رنگ خاکستری نمایش داده بشن.

این کدها بخوبی کار می کنن اما وقتی ارتفاع زیاد بشه، قسمت زیر فرم ورود بجای اینکه سفید رنگ باشه، خاکستری می شه.

چطور می تونم ارتفاع تگ #layer_1 رو طوری تعیین کنم که حد اقل به اندازه ارتفاع مانیتور باشه. برای اینکار ارتفاع این تگ رو 100 درصد قرار دادم ولی مشکل حل نشد.

لطفا راهنمایی کنید.

کدهای سی اس اس همین ها هستن.

کد:

body { margin:0; padding:0; font:12px Tahoma, Geneva, sans-serif; background-color:#eee; }
[B][COLOR=Blue]
#layer_1 {width:1024px; margin:0 auto; background-color:#FFF; height:100%; }[/COLOR][/B]

#layer_2 { direction:rtl; width:400px; margin:70px auto; border:1px  inset #999; padding:25px; background:#e1e1e1 url(../pic/tamplate/b1.jpg)  repeat; height:150px; overflow:hidden; }

کد های اچ تی ام ال رو هم براتون در ادامه قرار دادم.

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>صفحه ورود به پنل مديريت</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="./style/admin.css" type="text/css" rel="stylesheet" media="all"  />
</head>

<body>
<div id="layer_1">
<div id="layer_2">
محل نمايش فرم ورود
</div>
</div>
</body>
</html>

i-php-i · May 13, 2011

الان من کدهای شما رو تست کردم ولی کدهای شما فقط وقتی که ارتفاع محتویات صفحه کمتر از ارتفاع مانیتور باشه، بخوبی کار می کنه.

وقتیکه ارتفاع محتویایت صفحه بیشتر از ارتفاع مانیتور باشه، محتویات از تگ بیرون می زنه و ظاهر صفحه خراب می شه.

برای حالتی که ارتفاع محتویات صفحه بیشتر از ارتفاع مانیتور هست چیکار باید کرد؟