سلام اساتید
این سایت رو ملاحظه کنید لطفا
http://www.qomtakhfif.com/
میخام در حالت موبایل که در هر سطر یک تخفیف نشون داده میشه ، تخفیف عریض تر شه به اندازه کل صفحه (از لحاظ چپ و راست)
یعنی این :
2.jpg
به این تبدیل شود :
3.jpg
css :
@font-face { font-family: 'BYekan';
src: url(fonts/BYekan.woff) format('woff');
}
.farsdesigner-com-main { width:100%; margin:0}
.farsdesigner-com-box {background-color:#c99045; width:235px;text-decoration:none;padding-bottom:10px;display: inline-block; margin-top:5px; margin-left:5px; margin-right:5px;margin-bottom:5px;text-align:center}
.farsdesigner-com-box h3 {color:#FFFFFF; font-family:BYekan; font-size:19px; padding-top:20px;margin-bottom:8px}
.farsdesigner-com-box ul {font-family:BYekan;list-style:none; margin:0 11px 0 0 }
.farsdesigner-com-box img {margin:1px 0 0 0; padding:0 0 0 0;}
.farsdesigner-com-box ul li {text-align:right;width:211px; height:27px}
.farsdesigner-com-box ul li p {background-color:#805a29; color:#fff; margin:1px 0 0 0; padding:0 0 0 0; line-height:25px;font-size:17px;}
.farsdesigner-com-box ul li p:hover {background-color:#ceb525}
.farsdesigner-com-kharid a {text-decoration:none; color:#805a29; background-color:#f1d52e; font-size:20px; font-family:BYekan; width:211px; line-height:55px; margin-top:10px; margin-right:auto; margin-left:auto; border-bottom:medium solid ; border-color:#b39f25; transition:all 0.5s; cursor: pointer; outline: none; display: inline-block;}
.farsdesigner-com-kharid a:hover {border-color:#9900FF}
پاسخ با نقل قول