می شه این منو رو بیارین وسط صفحه

pasargad-ir

Active Member
سلام.

یه منو با CSS دارم.

وقتی مقدار Align:center رو می دم منو میاد وسط اما نه وسط صفحه

نسبت به نقطه شروع تغییر وضعیت می ده

فایل 1.php

PHP:
<!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>Rounded corners</title>
<meta http-equiv="Content-Type"
    content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="1.css" />
</head>
<body>
 
<div id="menubox">
 <div id="menucont">
 <div class="menublock" onmouseover="this.className='display'" onmouseout="this.className='menublock'">
  <a class="tl" href="1.php">About This Site</a>
  <div class="subs"><a class="tl" href="1.php">Menu 1</a></div>
  <div class="subs"><a class="tl" href="1.php">Menu 2</a></div>
  <div class="subs"><a class="tl" href="1.php">Menu 3</a></div>
 </div>
 <div class="menublock" onmouseover="this.className='display'" onmouseout="this.className='menublock'">
  <a class="tl" href="2.php">Downloads</a>
  <div class="subs"><a class="tl" href="1.php">Menu 1</a></div>
 </div>
 <div class="menublock" onmouseover="this.className='display'" onmouseout="this.className='menublock'">
  <a class="tl" href="">Service</a>
  <div class="subs"><a class="tl" href="1.php">Menu 1</a></div>
 </div>
</div>
</body>
</html>

فایل 1.css
کد:
#menubox {
 background-color: transparent;
 direction: rtl;
 height: 30px;
 margin: 0px;
}
#menucont {
 background-color: transparent;
 color: #069;
 margin-right: 50%;
 position: absolute;
 text-align: center;
 z-index: auto;
}
.menublock, .display {
 background-color: #036;
 background-position: center;
 float: left;
 text-align: center;
 width: 100pt;
}
.subs {
 background-color: transparent;
}
.subs a {
 display: block;
}
.menublock .subs {
 display: none;
}
#menucont a.tl, #menucont a.tl:hover, #menucont a.tl:active, #menucont a.sl, #menucont a.sl:hover, #menucont a.sl:active {
 background-color: #069;
 color: #fff;
 display: block;
 font-family: "Tahoma", "Arial", "verdana", sans-serif;
 font-size: 10px;
 font-weight: normal;
 line-height: 17px;
 margin-bottom: 1px;
 margin-left: 1px;
 margin-right: 1px;
 margin-top: 1px;
 order: none;
 padding-bottom: 2px;
 padding-left: 2px;
 padding-right: 2px;
 padding-top: 2px;
 text-align: center;
 text-decoration: none;
}
#menucont a.tl:hover, #menucont a.tl:active, #menucont a.sl:hover, #menucont a.sl:active {
 background-color: green;
 text-align: center;
}
#menucont a.sl, #menucont a.sl:hover, #menucont a.sl:active {
 text-align: left;
}

داشتم یه مقاله در رابطه با ساخت منوی داینامیک توسط PHP و CSS مینوشتم که این منو منو کلی اذیت کرد.

لطفا زود تز زحمتش رو بکشید تا منم زودتر مقالم رو تموم کنم.

مرسی
 

Maxoya

Active Member
سلام
بفرمایید :
کد:
<!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>Rounded corners</title>
<meta http-equiv="Content-Type"
    content="text/html; charset=iso-8859-1" />
<style>
#menubox {
 background-color: transparent;
 direction: rtl;
 height: 30px;
 margin: 0px;
 width:400px;
}
#menucont {
 background-color: transparent;
 color: #069;
}
.menublock, .display {
 background-color: #036;
 background-position: center;
 float: left;
 width: 100pt;
}
.subs {
 background-color: transparent;
}
.subs a {
 display: block;
}
.menublock .subs {
 display: none;
}
#menucont a.tl, #menucont a.tl:hover, #menucont a.tl:active, #menucont a.sl, #menucont a.sl:hover, #menucont a.sl:active {
 background-color: #069;
 color: #fff;
 display: block;
 font-family: "Tahoma", "Arial", "verdana", sans-serif;
 font-size: 10px;
 font-weight: normal;
 line-height: 17px;
 margin-bottom: 1px;
 margin-left: 1px;
 margin-right: 1px;
 margin-top: 1px;
 order: none;
 padding-bottom: 2px;
 padding-left: 2px;
 padding-right: 2px;
 padding-top: 2px;
 text-align: center;
 text-decoration: none;
}
#menucont a.tl:hover, #menucont a.tl:active, #menucont a.sl:hover, #menucont a.sl:active {
 background-color: green;
}
#menucont a.sl, #menucont a.sl:hover, #menucont a.sl:active {
 text-align: left;
}

</style>
</head>
<body>
<div align="center">
<div id="menubox">
 <div id="menucont">
 <div class="menublock" onmouseover="this.className='display'" onmouseout="this.className='menublock'">
  <a class="tl" href="1.php">About This Site</a>
  <div class="subs"><a class="tl" href="1.php">Menu 1</a></div>
  <div class="subs"><a class="tl" href="1.php">Menu 2</a></div>
  <div class="subs"><a class="tl" href="1.php">Menu 3</a></div>
 </div>
 <div class="menublock" onmouseover="this.className='display'" onmouseout="this.className='menublock'">
  <a class="tl" href="2.php">Downloads</a>
  <div class="subs"><a class="tl" href="1.php">Menu 1</a></div>
 </div>
 <div class="menublock" onmouseover="this.className='display'" onmouseout="this.className='menublock'">
  <a class="tl" href="">Service</a>
  <div class="subs"><a class="tl" href="1.php">Menu 1</a></div>
 </div>
</div>
</div>
</body>
</html>
خیلی کد بد قلقی بود !!
html و css رو با هم گذاشتم شما خودت درستش کن

موفق باشی :rose:
 

pasargad-ir

Active Member
مرسی عزیز

فکر کنم فقط

<div align="center">

رو قرار دادی یا جای دیگه ای رو هم تغییر دادی ؟؟؟

مرسی
 

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

بالا