ثابت کردن موقعیت ها در کدهای css

fahimehf · Jul 3, 2007

باسلام

یک صفحه دارم که داخلش از تکنیک css استفاده کردم.
یک مشکلی هست اونم اینه که :
وقتی صفحه رو restore down می کنم یعنی اندازش کوچکتر می کنم تمام محتویات داخل صفحه بهم میریزه!
راه حل این مشکل چیه؟

echessdesign · Jul 4, 2007

درود بر شما
جهت دریافت پاسخ کامل، باید کد CSS و HTML خود را قرار دهید.
شما اندازه ها را بر حسب Pixel گرفته اید؟

fahimehf · Jul 6, 2007

بله برحسب pixel گرفتم ، البته جاهایی صفحم بهم میریزه که از position:absulute استفاده می کنم !

echessdesign · Jul 7, 2007

درود بر شما
زمانی که شما موقعیت یک المان رو شناور می کنی (Absolute) ، نسبت به المان مادر خود تغییر مکان میده، جهت بررسی کلی بهتر است که سورس صفحه خود را قرار بدی

echessdesign · Jul 7, 2007

درود بر شما
زمانی که شما موقعیت یک المان رو شناور می کنی (Absolute) ، در زمان تغییر سایز نسبت به المان مادر خود تغییر مکان میده، جهت بررسی کلی بهتر است که سورس صفحه خود را قرار بدی.

fahimehf · Jul 8, 2007

PHP:

<?php session_start(); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="rtl" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>صفحه ورود</title>
<style type="text/css">
<!--
a:link {
	color: #e6eef7;
}
a:hover {
	color:#FFFFFF;
}
-->
</style></head>
<style type="text/css">
.container {background:#e6eef7; color:#fff; margin:0 15px; 
 }
.rtop, .rbottom{
display:block;
background:#22648e;
}
.rtop *, .rbottom *{
display: block;
height: 1px;
overflow: hidden;
background:#e6eef7;
}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{
margin: 0 1px;
height: 15px;

}
#win{
margin-left:1px; margin-right:1px; border-style:outset; border-color:#e6eef7; border:1px; background-image:url(upload/images/login1.jpg); background-repeat:no-repeat; height:250px;
}
body {
	background-color:#22648e; 
}

</style>

<body style="font-family:tahoma; font-size:12px">

<?php
  if (isset ($_POST['submit']))
     {
	  if (empty($_POST['user']) || empty($_POST['pass']))
        echo "<label style='color:#FF0000'>Error : فیلدهای مربوطه را تکمیل فرمائید !</label>";
      else
        {	
        $u = $_POST['user'];
        $p = $_POST['pass'];
		
		// Connect to Mysql
        require('connect_mysql.php');	
		
		$q = "select username from users
		      where (user='$u') && (pass='$p')";
		$r = mysql_query($q);
		$n = mysql_num_rows($r) ;
		$q2 = "select idp from professor
			         where (user='$u') && (pass='$p') ";
		$r2 = mysql_query($q2);
		$n2 = mysql_num_rows($r2) ;
		
		if ($n!=0)
		   {
		   $row = mysql_fetch_row($r);
		    $un = $row[0]; 
		    $users = array('admin','operator');
			
		    for ($i =0 ; $i<=2 ; $i++)
			   if ($un==$users[$i])
			     $user = $users[$i];
		   }
		elseif ($n2!=0)
		   {
		   $row = mysql_fetch_row($r2);
		    $user = $row[0]; 
		   }
		else 
		    echo '<label style="color:#FF0000" >Error : نام کاربری یا رمز عبور نامعتبر است !</label> ';
		if ($n!=0 || $n2!=0)
		   {
			$HTTP_SESSION_VARS['user']=$user;
  		    require_once("cp_menu.php");
			exit;
		   }
	     }
	  }
?>	 

<div id="container" style="margin-left:350px; margin-right:350px; margin-top:100px;">
<b class="rtop">
  <b class="r1"></b> <b class="r2"></b> <b class="r3"></b> <b class="r4"></b>
</b>

<!--content goes here -->

<div style="background-color:#e6eef7; margin-right:1px; margin-left:1px;"><span style=" margin-left:155px; padding:20px; color:#000066; font-weight:bold;">این یک آزمایش است</span><img style=" position:absolute; left:365px; margin-top:3px;" src="upload/images/ulogo.jpg" /></div>
<div id="win">

<form method="post" action="login_3leval.php">
  <div style="margin-right:50px; margin-top:50px;">نام کاربری :</div><input name="user" style="margin-right:110px; width:150px" />
  <div style="margin-right:50px; margin-top:0px;">کلمه عبور :</div><input name="pass" type="password" style="margin-right:110px; width:150px"/> 
  <input type="submit" name="submit" value="تایید" style="font-family:tahoma; font-size:12; position:absolute; right:470px; margin-top:80px; width:160px; " />
</form>

</div>
<b class="rbottom">
  <b class="r4"></b> <b class="r3"></b> <b class="r2"></b> <b class="r1"></b>
</b>
</div> 


</body>
</html>