Bir satırda değişken büyüklükte iki imge, ortada ortalanmış, çok büyükse yatay kaydırma ile

Question

Temel olarak, ekranın ortasına değecek şekilde hizalanmış 2 resim yan yana görüntülemek istiyorum. görüntü boyutundan bağımsız). Sabit konumlandırma ile bunu yapabildim, ancak bu durumda, görüntüler ekranın "kendi" tarafları için çok büyükse kayma olmayacaktır.

HTML:

<div class="left"> 
    <img src="xyz.jpg"/> 
</div> 
<div class="right"> 
    <img src="abc.jpg"/> 
</div> 

CSS:

.left { 
    position: fixed; 
    right: calc(50% + 10px); 
    width: auto; 
} 
.right { 
    position: fixed; 
    left: calc(50% + 10px); 
    width: auto; 
} 

FIDDLE

aynı davranışı almak, ancak yatay kaydırma ile nasıl sence? Pozisyon ile yapılamayacağına inanıyorum: Sabit. Başka bir yolu var mı? Thanks1

Answer 1

Genişliğini ve yarı genişliğini (% 50) kullanabilirsiniz. Gövde taşması için varsayılan değer otomatik olduğundan kaydırma otomatik olarak görüntülenir (kaydırma).

Bunu deneyin ve ne istediğinizi görün.

<div class="left"> 
    <img src="http://i.imgur.com/afd65O1.png" /> 
</div> 
<div class="right"> 
    <img src="http://i.imgur.com/WTuWgFvl.jpg" /> 
</div> 

Ve CSS Öneriniz için

.left, 
.right { 
    float: left; 
    width: 50%; 
} 

Fiddle

Answer 2

.left { 
    width: 50%; 
    float: left; 
    overflow-x: scroll; 
} 
.right { 
    width: 50%; 
    float: right; 
    overflow-x: scroll; 
}