Bir satırda% 100 genişlikte ve iki sabit div ile bir div

Question

Bir satırda üç div'e ihtiyacım var.

Biri 200px, ikinci 300px boyutunda ve son div ise geriye kalanlar olmalıdır.

Son div'um neden yeni bir satırda? width: 100% belirterek, sen geride kalan değil sadece ne sayfanın tüm genişliğini doldurmak için üçüncü div söyledim Çünkü

<div style="float: left; width: 200px; background: #223355">a</div> 
<div style="float: left; width: 300px; background: #223344">b</div> 
<div style="float: left; width: 100%; background: #334455">c</div> 

Answer 1

diğerleri% 100 sayfa genişliğinin% 100'dür .. ama

<div style="float: left; width: 200px; background: #223355">a</div> 
<div style="float: left; width: 300px; background: #223344">b</div> 
<div style="overflow: hidden; background: #334455">c</div> 

Answer 2

.

<div style="float: left; width: 100%"> 
    <div style="margin-left: 500px; background: #334455">c</div> 
</div> 

<div style="float: left; width: 500px; margin-left: -100%"> 
    <div style="width: 300px; float: left; background: #223355">a</div> 
    <div style="width: 200px; float: right; background: #223344">b</div> 
</div> 

siz istediğiniz şekilde işlemek gerekir: sarıcı div s birkaç ekleyerek, böyle bir şey alabilirsiniz.

Answer 3

Bunu% 100 genişliğe ayarladınız. Yüzdeğiniz gibi göreli bir genişlik, PARENT öğesinin genişliğine uygulanır. Yani, eğer bu 3 div için kapsayıcı 600px ise, o zaman üçüncü divinizle, diğer iki elementin tükettiği "artık" alanı değil,% 100'lük 600px alarak bitirdiniz.

Ne istiyorsunuz, basit CSS ile gerçekleştirilemez. Kalan alanı Javascript ile hesaplamanız ve üçüncü div genişliğini bu şekilde ayarlamanız ya da sabit genişlikte olmasını sağlamanız gerekir.

Answer 4

sadece zorunda olmamalı 'düz' CSS ile yapılamaz diyor kullanıcı ile katılmıyorum söylediler GİBİ float kaldırmak: sol; Son div'da çalışmak için mi?