2016-04-14 80 views
0

調整我有這個圖片犯規在Flexbox的

.parentcontainer 
{ 
background-color: black; 
max-width: 100%; 
display: flex; 
flex-direction: row; 
flex-wrap: nowrap; 
justify-content: flex-start; 
align-items: space-around; 


} 

.aside 
{ 
display:flex; 
flex: 30%; 

flex-direction: column; 
flex-wrap: nowrap; 
justify-content: flex-start; 
align-items: stretch; 



} 
.content 
{ 

background-color: blue; 
flex: 70%; 
display: flex; 
flex-direction: column; 
flex-wrap: wrap; 
justify-content: space-between; 
align-content: flex-start; 
max-height:800px; 


} 

.content img 
{ 
width: 100%; 
max-width: 100%; 
height: auto; 
} 

當我調整瀏覽器的。內容犯規調整大小的IMGS,我需要做一個橫向滾動。我該如何調整圖像大小?並且子容器不會比父容器大。謝謝。

編輯:現在我將.content更改爲列,mas高度更改爲800px。我希望。內容的文章下去,當它們達到800像素時,再製作一個專欄。問題就依然存在,。內容的文章而來的家長外箱代替或調整...

回答

0

試試這個:

.content img{ 
    width: 100%; 
    max-width: 100%; 
    height: auto 
} 
+0

不過IMGS不調整,見上面的編輯 – user3481415

+0

你有演示一些測試網址?或者你可以在jsfiddle.net上指定你的問題?謝謝 – RBrounek

+0

https://jsfiddle.net/at4nj4qa/謝謝。 – user3481415