سوال: نمایش سه div در کنار هم در یک لاین
#1
Note 
با سلام
من میخوام سه div  کنار هم و به هم چسبیده باشند ولی div  سمت راست صفحه padding-rightمیگیره و نمیذاره که به div  وسطی بچسبه روش هایی که میدونستم رو به کار بردم درست نشد لطفا جوابمو بدین خیلی لازمش دارم
کد:
/*CSS*/
.content
{
    padding:0 ;
    margin:0 auto ;
    background-color: #f3f3f3 ;
    border-top: 5px solid #d6d6d6 ;
    border-radius: 5px ;
    margin-top: 29px ;
    height: 275px ;
    width:100% ;}
/*HTML*/
       <div class="row">
           <div class="col-md-2" style="float:right ;padding-right:0 !important ;">
               <div style="">
                   <img src="pic/rightcon.png" >
               </div>
           </div>
           <div class="col-md-8" style="padding-left:0 !important ;padding-right:0 !important">
               <div class="content">
                   THIS IS CONTENT
               </div>
           </div>
           <div class="col-md-2" style="padding:0">
               <div>
                   <img src="pic/leftcon.png">
               </div>
           </div>
           <div style="clear:both"></div>                
        </div>

آخرین ویرایش: 01-02-2015 ساعت 14:16، توسط Daniel
پاسخ
#2
Note 
تگ cpu چه ربطی داره به موضوع؟
عنوان پیشنهادی برای موضوع: نمایش سه div در کنار هم در یک لاین
تگهای پیشنهادی: html div , نمایش div ها در کنار هم , نمایش div ها در یک لاین ,


از float باید استفاده کنی

روش اول:

کد:
<div class="left"> Some content </div>
<div class="right"> Some other content </div>
<div class="middle"> This should fill the space </div>
کد:
.left {
   float: left;
   background-color: #ddd;
}
.middle {
   background-color: yellow;
   display: block;
   overflow:hidden;
}
.right {
   float: right;
   background-color: #ddd;
}


روش دوم:

کد:
<div id="wrapper">
<div class="left"> Some content  Some content  Some content  Some content  Some content </div>
<div class="middle"> Some content  Some content  Some content  Some content  Some content </div>
<div class="right"> Some content  Some content  Some content  Some content  Some content </div>
</div>
کد:
#wrapper {
 margin: 0 auto;
 width: 97%;
 background: red;
 overflow: hidden;
}

.left,
.middle,
.right {
 width: 33.333%;
}

.left{background: blue; float: left;}
.middle{background: green; float: left;}
.right{background: yellow; float: right;}

JSBIN

آخرین ویرایش: 01-02-2015 ساعت 10:47، توسط C0der
پاسخ
#3
سلام ممنون از پاسختون
ایراد کارم رو چند روز پیش پیدا کردم و حل شد .
بابت انتخاب نامناسب تگ ها باید بگم من اون روز شدیدا عجله داشتم وباید زودتر پست رو میذاشتم 
امتیاز منفی واسه چی؟؟!!!

پاسخ
#4
من مدیر نیستم اما خوب معمولا اینا چیزیه که همه جا باید رعایت بشه حالا 10 ثانیه میتونستید بیشتر وقت بذارید.

آخرین ویرایش: 04-02-2015 ساعت 22:20، توسط C0der
پاسخ
ایجاد موضوع جدید   پاسخ به موضوع  

کاربرانِ درحال بازدید از این موضوع:   1 مهمان