مشكلة في CSS ...

Mr.Graphics · #1 26-08-2009, 02:01 AM

بسم الله الرحمن الرحيم
السلام عليكمـ ورحمة الله وبركاته
عندي مشكلتين صارت بالتطبيق لدرسين يا الـ غ ـآلين ..~
المشكلة اني بعد ما عملت الهيدر والفوتر ما تظهر بالفايرفوكس ..!! ويظهر تمام وزي الحلاوة بالاكسبلورر !!
بالنسبة لكودي .. هذا هو الكود حقي

كود:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<style>
.h1 {
 background-image:  url(CSS/images/CSS_03.gif);
 background-repeat: repeat-x;
 height: 190px;
}
.h2 {
 background-image:  url(CSS/images/CSS_05.gif);
 background-repeat: no-repeat;
 height: 190px;
 width: 337px;
 float: right;
}
.h3 {
 background-image:  url(CSS/images/CSS_01.gif);
 background-repeat: no-repeat;
 float: left;
 height: 190px;
 width: 258px;
}
.f1 {
 background-image:  url(CSS/images/CSS_11.gif);
 background-repeat: repeat-x;
 height: 98px;
}
.f2 {
 background-image:  url(CSS/images/CSS_12.gif);
 background-repeat: no-repeat;
 float: right;
 height: 98px;
 width: 337px;
}
.f3 {
 background-image:  url(CSS/images/CSS_09.gif);
 background-repeat: no-repeat;
 float: left;
 height: 98px;
 width: 258px;
}
.link1{
 color:#FFFFFF;
 font-family:Tahoma;
 font-size:11px;
 position:absolute;
 top:50px;
 left:500px;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div class="h1">
<div class="h2"></div>
<div class="h3"></div>
<div><a href="index.php" class="link1">Home</a></div>
</div>
<p>&nbsp;</p>
<div class="f1">
<div class="f2"></div>
<div class="f3"></div>
</div>
</body>
</html>

المشكلة هي
التأطير الرباعي ما رضى يضبط عدل ... يعني لو تشوفون بالصوره ما لصق عدل فوق وتحت الاطاران ...~
الصور توضح الامر يا الـ غ ـآليين ..~

وهذا الكود اللي انا سويتهـ

كود:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style>
.f-h-bg {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C.../images/up.gif);
 background-repeat: repeat-x;
 height: 73px;
}
.f-h-left {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...es/up-left.gif);
 background-repeat: no-repeat;
 float: left;
 height: 73px;
 width: 134px;
}
.f-h-right {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...s/up-right.gif);
 background-repeat: no-repeat;
 float: right;
 height: 73px;
 width: 139px;
}
.f-f-bg {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...mages/down.gif);
 background-repeat: repeat-x;
 height: 58px;
}
.f-f-left {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C.../down-left.gif);
 background-repeat: no-repeat;
 float: left;
 height: 58px;
 width: 61px;
}
.f-f-right {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...down-right.gif);
 background-repeat: no-repeat;
 float: right;
 height: 58px;
 width: 62px;
}
.body-bg {
 font-family: Tahoma;
 background-color: #FFFFFF;
}
.body-left {
 background: transsparent url(file:///C|/Users/Abdulaziz/Desktop/C...es/sh-left.gif) repeat-y left;
}
.body-right {
 background: transsparent url(file:///C|/Users/Abdulaziz/Desktop/C...s/sh-right.gif) repeat-y right ;
 padding-right: 30px; padding-left: 30px;
}
</style>
</head>
<body>
<div class="f-h-bg">
<div class="f-h-left"></div>
<div class="f-h-right"></div>
</div>

<div class="body-bg">
<div class="body-left">
<div class="body-right">
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="f-f-bg">
<div class="f-f-left"></div>
<div class="f-f-right"></div>
</div>
</body>
</html>

بالنسبة لحذف الأكواد حذفت الاكواد ...
 
 
 
 
 
---
وصار كذآ شكل التأطير .. :eh_s(11):

ويومن حطيت الكود

كود:

<p>&nbsp;</p>

عشان تصير مسافة بين الجزء العلوي والسفلي ... لآن على ما اظن ان ذاك الكود هو حق المسافة [ enter ]...
صار مقطوع كمآ في الرد الأعلا ...
وهذي صورة التأطير في الناف بار ...

---
ياليت تشوفون لي وش المشكلة يا الـغاليين .. عشان يمديني أحلها :eh_s(11):
لآني من جد تحطمت ..~ :eh_s(11):
وهذا الكود بعد التعديل

كود:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style>
.f-h-bg {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C.../images/up.gif);
 background-repeat: repeat-x;
 height: 73px;
}
.f-h-left {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...es/up-left.gif);
 background-repeat: no-repeat;
 float: left;
 height: 73px;
 width: 134px;
}
.f-h-right {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...s/up-right.gif);
 background-repeat: no-repeat;
 float: right;
 height: 73px;
 width: 139px;
}
.f-f-bg {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...mages/down.gif);
 background-repeat: repeat-x;
 height: 58px;
}
.f-f-left {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C.../down-left.gif);
 background-repeat: no-repeat;
 float: left;
 height: 58px;
 width: 61px;
}
.f-f-right {
 background-image: url(file:///C|/Users/Abdulaziz/Desktop/C...down-right.gif);
 background-repeat: no-repeat;
 float: right;
 height: 58px;
 width: 62px;
}
.body-bg {
 font-family: Tahoma;
 background-color: #FFFFFF;
}
.body-left {
 background: transsparent url(file:///C|/Users/Abdulaziz/Desktop/C...es/sh-left.gif) repeat-y left;
}
.body-right {
 background: transsparent url(file:///C|/Users/Abdulaziz/Desktop/C...s/sh-right.gif) repeat-y right ;
 padding-right: 30px; padding-left: 30px;
}
</style>
</head>
<body>
<div class="f-h-bg">
<div class="f-h-left"></div>
<div class="f-h-right"></div>
</div>

<div class="body-bg">
<div class="body-left">
<div class="body-right">
</div>
</div>
</div>
<div class="f-f-bg">
<div class="f-f-left"></div>
<div class="f-f-right"></div>
</div>
</body>
</html>

Mr.Graphics · #2 26-08-2009, 03:56 AM

اخواني تم حل المشكله ولله الحمد

بس باقي مشكلة وحده اللي هي

عدم ظهور الصور في الفايرفوكس ..؟؟