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

F

fahimehf

Member
باسلام

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

echessdesign

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

fahimehf

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

echessdesign

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

echessdesign

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

fahimehf

Member
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>
 
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا