من یک مانیتور 22 اینچ در رزولوشن 1080 فول hd دارم ولی مشکل اینجاست که صفحه سایتم به صورت wide در نمیاد و در وسط قرار داره با حاشیه بزرگ سفید رنگ.
اگه گفتی ;)
من یک مانیتور 22 اینچ در رزولوشن 1080 فول hd دارم ولی مشکل اینجاست که صفحه سایتم به صورت wide در نمیاد و در وسط قرار داره با حاشیه بزرگ سفید رنگ.
اگه گفتی ;)
عنصری رو که برای css تعریف کردین با % مقدار بدین.
مثال:
<div class="main">
</div>
div.main{ width: 100%; }
اگه منظور این قسمته:
#top-wrap{width:975px;height:40px;background:url(images/topwrap.gif) top left no-repeat;margin:auto}
#wrapper{width:975px;background:url(images/bg.gif) top left repeat-y;margin:auto}
#frame,#content{width:955px;margin:auto}
خوب تغییر میدم ولی درست بشو نیست.
#top-wrap{width:90%;height:40px;background:url(images/topwrap.gif) top left no-repeat;margin:auto}
#wrapper{width:90%;background:url(images/bg.gif) top left repeat-y;margin:auto}
#frame,#content{width:85%;margin:auto}
ممنون از پیگیری
اما بازم مشکل پابرجاست!
اصلاح کد فقط باعث تغییر مکان صفحه سفید رنگ ،یکم به سمت چپ میشه. ولی اندازه تغییر نکرده و واید نشده. در ضمن دیگر مطالب و اجزاء سایت در جای قبلی موندن و در موقعیت جدیدشون پخش نشدن.
برای راهنمایی کل فایل اصلی style.css رو قرار دادم.
*{text-decoration:none;margin:0;padding:0}
body{font-family:Arial;font-size:12px;color:#4d4b4c;background:#696969}
ol li{list-style-position:inside}
h3{font-size:14px;padding:10px 0}
a:link{text-decoration:none;color:#069;border:0}
a:hover{color:#56bdea;border:0}
a:focus{outline:none}
.clear{clear:both}
#top-wrap{width:975px;height:40px;background:url(images/topwrap.gif) top left no-repeat;margin:auto}
#wrapper{width:975px;background:url(images/bg.gif) top left repeat-y;margin:auto}
#frame,#content{width:955px;margin:auto}
#content{margin-top:10px}
#photo{width:915px;padding:0 0 0 20px}
#top-panel{color:#fff;width:100%;text-align:right;position:absolute;top:0;right:0;font-size:10px;background:#3b3b3b;border-bottom:3px solid #3b3b3b;border-left:3px solid #3b3b3b;margin:0;padding:2px 5px}
#top-panel ul li{display:inline;padding:0}
#top-panel label,#top-panel input{font-size:9px}
#top-panel label{padding-left:5px}
#sub-panel a{float:right;margin-right:5px;color:#FFF;text-decoration:none;font-size:10px;font-weight:700;background:#777}
#sub-panel a span{display:block;border-left:2px solid #3b3b3b;border-right:2px solid #3b3b3b;border-bottom:2px solid #3b3b3b;padding:2px 5px}
#infobar{height:30px;width:955px;line-height:30px;font-size:10px;color:#fff;padding-top:5px;margin:0 auto}
#browse{float:left;width:550px;background:url(images/sitemap.gif) no-repeat 0 6px;margin-left:3px;padding-left:22px}
#rss{float:right;margin-right:3px;width:360px}
#rss p{text-align:right}
#header{display:block;width:915px;height:85px;margin:0 auto}
#logo{display:block;float:left;background:url (images/logo.gif) top left no-repeat;height:40px;margin:30px 0 0}
#logo h1 a{font-size:24px;color:#666;padding:10px 0 0}
#searchbox{float:right;width:200px;border:1px solid #ccc;margin:30px 0 0}
#searchbox #s{float:left;border:0;width:155px;background:none;color:#999;margin:3px 0 0 5px}
#searchbox #go{float:right;border-left:1px solid #ccc}
#nav{display:block;background:url(images/navbg.gif) left repeat-x;width:915px;height:52px;border-bottom:1px solid #e6e6e6;margin:0 auto}
#nav li{float:left;list-style:none}
#nav li a{display:block;font-weight:700;color:#fff;padding:6px 15px}
#cat{float:left;clear:both}
#cat li a{color:#333;font-size:.9em}
#cat li a:hover{color:#fff}
.clearfloat:after{display:block;visibility:hidden;clear:both;height:0;content:"."}
.clearfloat{display:block}
#subnav{position:relative;padding-bottom:10px;font-size:.8em;border-bottom:1px dotted #ccc;margin:0 10px 5px}
#subnav li a{float:left;margin-right:15px;background:#3b3b3b;border-left:3px solid #8BDBFF;color:#fff;padding:1px 5px}
#subnav .current_page_item a,#subnav a:hover{border-left:3px solid #f60}
#left{float:left;width:570px;padding-left:10px}
.entry{text-align:justify;width:550px;margin-bottom:10px;line-height:140%;padding:0 10px}
.related-post{width:530px;border:1px solid #ACE;background:#EBF3FB;margin:0 10px;padding:10px}
.related-post ul{border-top:1px solid #e6e6e6;margin-bottom:5px}
.related-post ul li{border-bottom:1px solid #e6e6e6;padding:5px 0}
.content a{border-bottom:1px dotted #ccc}
.entry h2{font:bold 22px/28px "Myriad Pro","Myriad Set","Myriad Apple",Myriad,Helvetica Nueue,Arial,Verdana,Sans-serif;letter-spacing:-1px;margin-bottom:10px}
.entry h2 a{color:#222}
.entry h2 a:hover{color:#999}
html>body .entry ul{padding:0 0 0 10px}
html>body .entry li{margin:7px 0 8px 10px}
.entry ul li{padding-left:20px;background:url(images/bullet.gif) left no-repeat}
.entry img{margin:0 10px 10px}
img.centered{display:block;margin-left:auto;margin-right:auto}
img.alignright{display:inline;margin:0 0 2px 7px;padding:4px}
img.alignleft{display:inline;margin:0 7px 2px 0;padding:4px}
.alignleft{float:left;padding-left:30px;padding-bottom:20px}
.custom_image img{float:left;border:2px solid #e6e6e6;height:90px;width:90px;margin:7px 10px 15px 0;padding:3px}
.subcontrol{margin-bottom:10px;font-size:11px;font-weight:700;border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;padding:5px}
.tags,.allinfos{background:#FFF8AF url(images/tag.gif) left no-repeat;font-size:11px;font-weight:700;border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;padding:5px 0 5px 25px}
.allinfos{background:#F2f2f2;margin-bottom:10px;padding:5px}
.share,.comments_rss,.reply{float:right;padding-left:20px}
.reply{background:url(images/comments.gif) left no-repeat;margin-left:10px}
.comments_rss{background:url(images/feed.gif) left no-repeat;margin-left:10px;position:relative;top:10px}
span.date{background:url(images/date.gif) no-repeat;padding-left:20px}
span.comments{background:url(images/comment.gif) no-repeat;padding-left:20px}
span.category{background:url(images/posted.gif) no-repeat;padding-left:20px}
.navigation{width:540px;line-height:140%;font-size:11px;padding:10px}
#sidebarbottom{float:right;width:360px;margin-right:10px;clear:right}
#right{float:right;width:355px;margin-right:17px}
#topsidebar{width:330px;border:1px solid #dadada;background:#fff;margin-bottom:10px;padding:0 10px}
#lsidebar{float:left;width:135px;border:1px solid #dadada;background:#fff;padding:5px}
#rsidebar{float:left;width:170px;border:1px solid #dadada;background:#fff;margin-left:11px;padding:5px 10px}
#sidebarbottom ul{margin:10px auto 20px}
#sidebarbottom ul li ul li{display:block;background:url(images/sidebullet.gif) no-repeat 0 0;padding-left:24px;padding-bottom:5px;border-bottom:1px dotted #dadada}
#sidebarbottom p{padding:0 5px}
#about{width:350px;border:1px solid #FFD1AF;background:#FFF8AF;margin-bottom:10px}
#about h2{padding:5px 10px}
#author-box{font-size:11px;text-align:justify;margin:0 10px 10px}
#author-box .avatar{float:left;border:1px solid #ccc;background:#fff;margin:3px 10px 0 0;padding:3px}
.commentlist li{padding-top:5px;border-bottom:1px dotted #e6e6e6;list-style:none}
.ctext{margin-left:70px}
.trackbacks a{color:#069;border-bottom:1px dotted #e6e6e6}
.user{font-weight:700;font-size:14px;padding-top:10px}
.author{background:#FFF8AF;padding-right:10px}
#commentform #comment{border:1px solid #dadada;height:200px;width:550px}
#footbg{width:100%;background:#222 url(images/footerbg.gif) top left repeat-x}
#footwrap{width:975px;background:url(images/closecontent.gif) top left no-repeat;margin:auto}
.footer-links{float:left;width:300px;margin-right:37px;color:#888;margin-top:15px}
.footer-links-r{float:right;width:300px;color:#888;margin-top:15px}
.footer-links h2,.footer-links-r h2{color:#fff;background-color:#3b3b3b;font-size:1.2em;padding:5px 10px}
.footer-links ul{margin-bottom:15px}
.footer-links ul li{margin-top:1px}
.footer-links a,.footer-links a:visited,.footer-links-r a,.footer-links-r a:visited{display:block;height:18px;background-color:#2e2e2e;color:#ccc;padding:5px 10px}
.footer-links a:hover,.footer-links-r a:hover{background:#4b4b4b;color:#56bdea}
#copyright{border-top:1px solid #3b3b3b;font-size:10px;padding:10px 0}
#copyright ul li{float:right;padding-left:10px}
acronym,abbr,span.caps{cursor:help}
acronym,abbr{border-bottom:1px dashed #999}
blockquote{padding-left:20px;border-left:5px solid #ddd;margin:15px 30px 15px 10px}
blockquote cite{display:block;margin:5px 0 0}
hr{display:none}
a img{border:none}
pre{border:solid 1px #9a9a9a;color:blue;background:#f3f2ed;margin:10px;padding:10px}
code{font-size:1em;color:#000}
.gallery img{padding:3px}
#flickr img,#more img{border:3px solid #e6e6e6;width:60px;height:60px;margin:50px 25px 0 0}
#more img{width:59px;margin-right:0}
#feedstats{float:right;width:92px;height:25px;font-size:10px;background:url(images/feedstats.gif) no-repeat}
#feedstats a{position:relative;top:3px;right:12px;width:50px;color:#000;float:right}
#feedstats a:hover{background:none}
ul li,#nav,#nav ul{list-style:none}
a:active,a:visited{color:#069;border:0}
#top-panel a,#infobar a,#copyright a{color:#8BDBFF}
#infobar a:hover,#copyright a:hover{text-decoration:underline}
#nav li a:hover,#nav a:hover,#nav a:active,.current_page_item a,#home .on,.photo{background:#f60}
#subnav ul,#copyright ul{display:inline}
.entry p,#commentform p{padding-bottom:10px}
.alignright,.imgright,#more{float:right}
#lsidebar h2,#rsidebar h2{font-size:15px;margin-bottom:10px;color:#4c4c4c}
.avatar img,.imgleft,#flickr{float:left}
#commentform #author,#commentform #email,#commentform #url{border:1px solid #dadada;height:20px;width:200px}
.center,.gallery,.attachment,.imgnav{text-align:center}
.attachment img,.imgleft img,.imgright img{border:1px solid #999;padding:5px}
/*+++++++ BODY +++++++*/
* { margin: 0px; padding: 0px; text-decoration:none; }
body { font-family: Arial; font-size: 12px; color: #4d4b4c; background: #696969; }
ul li {list-style:none;}
ol li {list-style-position: inside}
/*+++++++ H1,H2,H3 HYPERLINKS +++++++*/
h3 { padding:10px 0 10px 0; font-size:14px;}
a:link { text-decoration: none; color: #006699; border: 0px;}
a:active {color : #006699; border: 0px;}
a:visited { color :#006699 ; border: 0px;}
a:hover { color:#56bdea; border: 0px;}
a:focus { outline: none;}
.clear { clear: both; }
/*+++++++ MAIN +++++++*/
#top-wrap {width: 975px; height: 40px; margin:auto; background: url(images/topwrap.gif) top left no-repeat;}
#wrapper { width: 975px; margin:auto; background: url(images/bg.gif) top left repeat-y;}
#frame,#content{ width: 955px; margin:auto; }
#content {margin-top:10px;}
#photo { width: 915px; padding: 0 0 0 20px; }
/*+++++++ PANEL +++++++*/
#top-panel{color: #fff; width: 100%; text-align: right; position:absolute; top: 0; right:0;font-size: 10px;background:#3b3b3b;border-bottom:3px solid #3b3b3b; border-left:3px solid #3b3b3b; padding: 2px 5px;margin:0}
#top-panel a {color: #8BDBFF}
#top-panel ul li {display: inline; padding:0}
#top-panel label, #top-panel input { font-size: 9px}
#top-panel label {padding-left: 5px}
#sub-panel a{float:right; margin-right: 5px; color:#FFF; text-decoration:none; font-size: 10px;font-weight:bold;background:#777;}
#sub-panel a span{padding: 2px 5px; display:block; border-left: 2px solid #3b3b3b; border-right: 2px solid #3b3b3b; border-bottom: 2px solid #3b3b3b /*background:url(img/sub-right.png) right bottom no-repeat;*/}
/*+++++++ INFOBAR +++++++*/
#infobar { height: 30px; width: 955px; line-height:30px; font-size:10px; margin: 0 auto; color: #fff; padding-top: 5px}
#infobar a {color: #8BDBFF}
#infobar a:hover {text-decoration: underline;}
#browse { float: left; width: 550px; background:url(images/sitemap.gif) no-repeat 0 6px; margin-left: 3px; padding-left:22px}
#rss { float: right; margin-right: 3px; width: 360px}
#rss p {text-align:right;}
/*+++++++ HEADER+++++++*/
#header {display:block; width: 915px; height: 85px; margin: 0 auto;}
#logo {display: block; float:left; background: url (images/logo.gif) top left no-repeat; height: 40px; margin: 30px 0 0 0;}
#logo h1 a {padding: 10px 0 0 0; font-size: 24px; color: #666}
#searchbox { float:right; width: 200px; border: 1px solid #ccc; margin:30px 0 0 0;}
#searchbox #s { float: left; margin: 3px 0 0 5px; border: 0; width: 155px; background: none; color:#999999;}
#searchbox #go { float: right; border-left: 1px solid #ccc}
/*+++++++ NAVIGATION+++++++*/
#nav{display: block; background: url(images/navbg.gif) left repeat-x; width: 915px; height: 52px; margin: 0 auto; border-bottom: 1px solid #e6e6e6}
#nav, #nav ul {list-style: none}
#nav li{float: left;list-style:none}
#nav li a { display:block;font-weight:bold; color:#fff; padding:6px 15px;}
#nav li a:hover {background: #ff6600}
#cat{float: left; clear: both}
#cat li a{ color: #333; font-size: 0.9em}
#cat li a:hover {color:#fff}
/*#nav li ul {height:80px; left:-999em; position:absolute; width:100%; z-index:999; font-size: 0.9em;font-weight: bold; margin-left: 50px}
#nav li li a {background: none;color: #006699; border-right: 1px solid #666; margin-top: 5px; padding: 1px 10px}
#nav li li a:hover{background: none; text-decoration:underline}*/
.clearfloat:after {display:block;visibility:hidden;clear:both;height:0;content:".";}
.clearfloat {display:inline-block}
.clearfloat {display:block}
#nav a:hover, #nav a:active, .current_page_item a, #home .on, .photo {background: #ff6600}
#subnav {position:relative; margin: 0 10px 5px; padding-bottom: 10px; font-size: 0.8em; border-bottom: 1px dotted #ccc}
#subnav ul {display: inline}
#subnav li a{float: left; padding: 1px 5px; margin-right:15px; background: #3b3b3b; border-left: 3px solid #8BDBFF; color: #fff }
#subnav .current_page_item a, #subnav a:hover {border-left: 3px solid #ff6600}
/*+++++++ ENTRY +++++++*/
#left { float: left; width: 570px; padding-left: 10px; }
.entry { text-align: justify; width: 550px; padding:0 10px; margin-bottom:10px; line-height:140%}
.entry ol li {}
.related-post { width: 530px; padding: 10px; margin: 0 10px}
.related-post { border:1px solid #AACCEE; background:#EBF3FB}
.related-post ul {border-top:1px solid #e6e6e6; margin-bottom: 5px;}
.related-post ul li {padding: 5px 0px; border-bottom: 1px solid #e6e6e6}
.content a { border-bottom: 1px dotted #ccc}
.entry h2 { font: bold 22px/28px "Myriad Pro","Myriad Set","Myriad Apple",Myriad,Helvetica Nueue,Arial,Verdana,Sans-serif;letter-spacing: -1px;margin-bottom:10px;}
.entry h2 a { color:#222222; }
.entry h2 a:hover {color:#999999;}
.entry p { padding-bottom:10px;}
html>body .entry ul { padding: 0 0 0 30px; padding-left: 10px; }
html>body .entry li { margin: 7px 0 8px 10px; }
.entry ul li {padding-left: 20px; background: url(images/bullet.gif) left no-repeat}
.entry img {margin:0 10px 10px 10px;}
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
.alignright { float: right; }
.alignleft { float: left ;}
.custom_image img{float:left; padding:3px; margin:7px 10px 15px 0; border: 2px solid #e6e6e6; height:90px; width: 90px}
.subcontrol {margin-bottom: 10px;padding:5px; font-size: 11px; font-weight: bold; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6}
.tags, .allinfos {padding:5px 0px 5px 25px; background: #FFF8AF url(images/tag.gif) left no-repeat; font-size: 11px; font-weight: bold; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6}
.allinfos {background: #F2f2f2; padding: 5px; margin-bottom: 10px}
.share, .comments_rss, .reply {float: right; padding-left: 20px}
.reply {background: url(images/comments.gif) left no-repeat; margin-left:10px}
.comments_rss {background: url(images/feed.gif) left no-repeat; margin-left:10px; position:relative; top: 10px}
span.date { background:url(images/date.gif) no-repeat; padding-left:20px; }
span.comments { background:url(images/comment.gif) no-repeat; padding-left:20px; }
span.category { background:url(images/posted.gif) no-repeat; padding-left:20px; }
.navigation { width: 540px; padding:10px; line-height:140%; font-size:11px; }
/*+++++++ SIDEBAR +++++++*/
#sidebarbottom { float:right; width: 360px; margin-right: 10px; clear: right;}
#right { float:right; width: 355px; margin-right: 17px }
#topsidebar { width: 330px; padding:0 10px; border:1px solid #dadada; background:#fff; margin-bottom:10px}
#lsidebar h2 { font-size:15px; margin-bottom:10px; color:#4c4c4c;}
#rsidebar h2 { font-size:15px; margin-bottom:10px; color:#4c4c4c; }
#lsidebar { float:left; width:135px; padding:5px; border:1px solid #dadada; background:#fff;}
#rsidebar { float:left; width:170px; padding:5px 10px 5px 10px; border:1px solid #dadada; background:#fff; margin-left:11px;}
#sidebarbottom ul{ margin:10px auto 20px;}
#sidebarbottom ul li{}
#sidebarbottom ul li ul{}
#sidebarbottom ul li ul li{display:block; background:url(images/sidebullet.gif) no-repeat 0 0; padding-left:24px; padding-bottom:5px; border-bottom:1px dotted #dadada;}
#sidebarbottom p{padding:0 5px;}
/*+++++++ ADMIN +++++++*/
#about {width: 350px; border:1px solid #FFD1AF; background:#FFF8AF; margin-bottom:10px; }
#about h2 {padding: 5px 10px;}
#author-box {margin: 10px;margin-top: 0px; font-size: 11px; text-align: justify;}
#author-box .avatar {float: left; padding: 3px; border: 1px solid #ccc; background: #fff; margin: 3px 10px 0 0}
/*+++++++ COMMENTS +++++++*/
.commentlist li{padding-top: 5px; border-bottom:1px dotted #e6e6e6; list-style: none}
.avatar img {float:left}
.ctext {margin-left: 70px}
.trackbacks a {color: #006699; border-bottom: 1px dotted #e6e6e6;}
.user {font-weight: bold; font-size: 14px; padding-top:10px;}
.author {background: #FFF8AF; padding-right: 10px;}
#commentform p { padding-bottom:10px;}
#commentform #author { border:1px solid #dadada; height:20px; width:200px; }
#commentform #email { border:1px solid #dadada; height:20px; width:200px; }
#commentform #url { border:1px solid #dadada; height:20px; width:200px;}
#commentform #comment { border:1px solid #dadada; height:200px; width:550px;}
/*+++++++ FOOTER +++++++*/
#footbg {width: 100%; background: #222 url(images/footerbg.gif) top left repeat-x}
#footwrap { width: 975px; margin:auto; background: url(images/closecontent.gif) top left no-repeat}
.footer-links { float: left; width:300px; margin-right: 37px; color: #888; margin-top:15px;}
.footer-links-r { float: right; width:300px; color: #888; margin-top:15px;}
.footer-links h2, .footer-links-r h2 { color: #fff; background-color: #3b3b3b; font-size: 1.2em; padding:5px 10px; }
.footer-links ul {margin-bottom:15px;}
.footer-links ul li {margin-top:1px;}
.footer-links a, .footer-links a:visited, .footer-links-r a, .footer-links-r a:visited {display: block; height:18px; background-color: #2e2e2e; color: #ccc; padding: 5px 10px;}
.footer-links a:hover, .footer-links-r a:hover {background: #4b4b4b; color: #56bdea;}
#copyright {padding: 10px 0; border-top: 1px solid #3b3b3b; font-size: 10px}
#copyright a {color: #8BDBFF}
#copyright a:hover {text-decoration: underline;}
#copyright ul{display:inline}
#copyright ul li {float:right; padding-left: 10px}
/**************** Misc *********************/
acronym, abbr, span.caps { cursor: help; }
acronym, abbr { border-bottom: 1px dashed #999; }
blockquote { margin: 15px 30px 15px 10px; padding-left: 20px; border-left: 5px solid #ddd; }
blockquote cite { margin: 5px 0 0; display: block; }
.center { text-align: center; }
hr { display: none; }
a img { border: none; }
.alignright{float:right;}
.alignleft{float:left; padding-left:30px; padding-bottom:20px;}
img.centered{display:block;margin-left:auto;margin-right:auto;}
img.alignright{display:inline;margin:0 0 2px 7px;padding:4px;}
img.alignleft{display:inline;margin:0 7px 2px 0;padding:4px;}
pre {border: solid 1px #9a9a9a;color: blue;margin: 10px;padding:10px;background: #f3f2ed}
code {font-size:1.0em;color: #000}
/**************** Gallery *********************/
.gallery {text-align:center;}
.gallery img {padding:3px;}
.attachment {text-align:center;}
.attachment img { padding:5px; border:1px solid #999999;}
.imgnav {text-align:center;}
.imgleft {float:left;}
.imgleft img{ padding:5px; border:1px solid #999999;}
.imgright {float:right;}
.imgright img{ padding:5px; border:1px solid #999999;}
/**************** Flickr *********************/
#flickr {float: left}
#flickr img, #more img {margin:50px 25px 0px 0; border: 3px solid #e6e6e6; width: 60px; height: 60px;}
#more {float: right}
#more img {width: 59px; margin-right: 0}
/**************** Twitter *********************/
#twitter { width: 350px; border:1px solid #dadada; background:#fff; margin-bottom:10px; }
#twitter h2 {background: #EBF3FB; padding: 5px 10px;}
#twitter ul li {margin-top: 10px; margin-left: 25px; padding:0 10px 0px 0px; list-style-type: disc}
/**************** Feedstats *********************/
#feedstats {float:right;width: 92px;height: 25px; font-size: 10px; background:url(images/feedstats.gif) no-repeat;}
#feedstats a{position:relative; top: 3px; right: 12px; width: 50px; color: #000; float: right}
#feedstats a:hover {background: none;}