عدم نمایش صحیح جدول در Firefox

P

Peter Pro

Member
سلام :)
دوستان جدول قرار گرفته در سورس كد زير در Internet Explorer 7 به درستي نمايش داده مي شود، اما در Firefox جدول به درستي نمايش داده نمي شود!
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" xml:lang="en" lang="en">
<head>
<title>Table test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
body {
  margin: 0;
  padding: 0;
  background-color: #ffffff;
  font-family: "tahoma", arial, sans-serif;
  font-size: 12px;
}
#global {
  width: 921px;
  height: 500px;
  margin: 0 auto;
  padding-top: 10px;
}
.p {
  display: inline;
  font: bold 12px "tahoma", arial, sans-serif;
  text-align: center;
  color: #ffffff;
}
.t1 {
  float: left;
  width: 449px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px 0 0 1px;
  background-color: #ff0000;
  padding: 5px;
  text-align: center;
}
.t2 {
  clear: both;
  float: left;
  margin: 0 0 1px 0;
  padding: 0;
  width: 459px;
  height: 80px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px 0 1px 1px;
  text-align: justify;
}
.t2 ul {
  margin: 0 auto;
  padding: 5px 0 0 10px;
  list-style: none;
}
.t3 {
  float: left;
  width: 449px;
  padding: 5px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px 1px 0 0;
  border-left: 1px solid #cccccc;
  background-color: #ff0000;
  text-align: center;
}
.t4 {
  float: left;
  margin: 0 0 1px 0;
  padding: 0;
  width: 459px;
  height: 80px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px;
  text-align: justify;
}
.t4 ul {
  margin: 0 auto;
  padding: 5px 0 0 10px;
  list-style: none;
}
</style>
</head>
<body>
<div id="global">
<div class="t1"><p class="p">&nbsp;</p></div>
<div class="t2">
<ul>
<li></li>
</ul>
</div>
<div class="t3"><p class="p">&nbsp;</p></div>
<div class="t4">
<ul>
<li></li>
</ul>
</div>
</div>
</body>
</html>
 
آخرین ویرایش:
A

ayaffo

New Member
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" xml:lang="en" lang="en">
<head>
<title>Table test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
body {
  margin: 0;
  padding: 0;
  background-color: #ffffff;
  font-family: "tahoma", arial, sans-serif;
  font-size: 12px;
}
#global {
  width: 921px;
  height: 500px;
  margin: 0 auto;
  padding-top: 10px;
}
.p {
  display: inline;
  font: bold 12px "tahoma", arial, sans-serif;
  text-align: center;
  color: #ffffff;
}
.t1 {
  float: left;
  width: 449px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px 0 0 1px;
  background-color: #ff0000;
  padding: 5px;
  text-align: center;
}
.t2 {
  clear: both;
  float: left;
  margin: 0 0 1px 0;
  padding: 0;
  width: 459px;
  height: 80px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px 0 1px 1px;
  text-align: justify;
}
.t2 ul {
  margin: 0 auto;
  padding: 5px 0 0 10px;
  list-style: none;
}
.t3 {
  float: left;
  width: 449px;
  padding: 5px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px 1px 0 0;
  border-left: 1px solid #cccccc;
  background-color: #ff0000;
  text-align: center;
}
.t4 {
  float: left;
  margin: 0 0 1px 0;
  padding: 0;
  width: 459px;
  height: 80px;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px;
  text-align: justify;
}
.t4 ul {
  margin: 0 auto;
  padding: 5px 0 0 10px;
  list-style: none;
}
</style>
</head>
<body>
<div id="global">
<div class="t1"><p class="p">&nbsp;</p></div>
<div class="t3"><p class="p">&nbsp;</p></div>
<div class="t2">
<ul>
<li></li>
</ul>
</div>
<div class="t4">
<ul>
<li></li>
</ul>
</div>
</div>
</body>
</html>
 
P

Peter Pro

Member
دوست عزيز t2 حتما بايد در زيز t1 قرار بگيره!!! SEO
راه حل شما را قبلا امتحان كرده بودم ولي از نظر SEO به مشكل بر مي خورم.
اميدوارم از طريق CSS اين مشكل حل بشه.
اساتيد مشكل حل نشد!؟
 
آخرین ویرایش:
peyman1987

peyman1987

Member
خوب چه اصراريه حتما اينجوري نوشته بشه. بنظر من اين بهتر مياد.

HTML: 
<html>
	<head>
		<style>
			body
			{
				text-align: center;
			}
			
			div#div_place_holder
			{
				width: 804px;
				margin: 20px auto;
			}
			
			div.div_main
			{
				float: left;
			}
			
			div.div_header
			{
				background: red;
				width: 400px;
				height: 15px;
				border: 1px solid black;
			}
			
			div.div_body
			{
				border: 1px solid black;
				width: 400px;
				height: 100px;
			}
		</style>
	</head>
	<body>
		<div id='div_place_holder'>
			<div class='div_main'>
				<div class='div_header'></div>
				<div class='div_body'></div>
			</div>
			<div class='div_main'>
				<div class='div_header'></div>
				<div class='div_body'></div>
			</div>
		</div>
	</body>
</html>
 
shnoit

shnoit

Well-Known Member
حالا دوست عزیز نمیشه از <table> استفاده کنی !؟
مگه ایرادی داره به نظرت !؟
 
peyman1987

peyman1987

Member
shnoit گفت:
حالا دوست عزیز نمیشه از <table> استفاده کنی !؟
مگه ایرادی داره به نظرت !؟
کلیک کنید تا باز شود...

همش ايراده!!!!
جدول براي ساختن ساختار وب سايت درست نشده. فقط از جدول براي نمايش اطلاعات داخل جدول بايد استفاده بشه.

خيلي وقته ديگه کسي با جدول طراحي نميکنه.
 
P

Peter Pro

Member
peyman1987 گفت:
خوب چه اصراريه حتما اينجوري نوشته بشه. بنظر من اين بهتر مياد.

HTML: 
<html>
    <head>
        <style>
            body
            {
                text-align: center;
            }
 
            div#div_place_holder
            {
                width: 804px;
                margin: 20px auto;
            }
 
            div.div_main
            {
                float: left;
            }
 
            div.div_header
            {
                background: red;
                width: 400px;
                height: 15px;
                border: 1px solid black;
            }
 
            div.div_body
            {
                border: 1px solid black;
                width: 400px;
                height: 100px;
            }
        </style>
    </head>
    <body>
        <div id='div_place_holder'>
            <div class='div_main'>
                <div class='div_header'></div>
                <div class='div_body'></div>
            </div>
            <div class='div_main'>
                <div class='div_header'></div>
                <div class='div_body'></div>
            </div>
        </div>
    </body>
</html>
کلیک کنید تا باز شود...
پيمان جان عالي بود، مشكل حل شد، سپاسگزارم :)
 
برای ارسال پاسخ شما باید وارد سیستم شوید.

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

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

بالا