CSS：增加父寬度，如果p覆蓋的高度

我有一個圖像是100％的窗口。裏面我有一個絕對定位的div（類caption），它顯示標題和一些文本。這個標題有36％的min-width。我的網站如果完全響應。CSS：增加父寬度，如果p覆蓋的高度

我正在使用媒體查詢重新定位平板電腦和手機上的標題。但是，有時item內的文字太大 - 標題的高度大於圖像。

我使用下面的代碼來解決這個使用JavaScript，但感覺大馬車（當用戶改變瀏覽器，它不工作）：

window.onload = function(){ 
    setWidth(); 
}; 

var count = 0; 
function setWidth() { 
    $('.item').each(function() { 
     if ($(this).find('.caption')[0].scrollHeight > $(this).height() && count <= 100) { 
      $(this).find('.caption').css('width', $(this).find('.caption').width() + 10); 
      count++; 
      setWidth(); 
     } 
    }); 
}

有沒有一種方法，我可以實現使用只是CSS相同的效果。 caption上的max-height爲100％，min-width爲36％，並且隨着標題高度改變，寬度將相應地改變。

來源

2013-02-22 Deco

工作代碼時調整，你必須使用'window.onresize'事件瀏覽器。爲了給你更好的解決方案，你可以在jsfiddle.net中創建一個示例並與我們分享... – Ryxle 2013-02-22 14:34:48

很難看出CSS是否可行，如果沒有標記就可以了。至於JavaScript，您希望將resize函數附加到window.onresize事件中，只要窗口調整大小，就會調用它。

See example on JSFiddle

window.onresize = updateDimensions; 

function updateDimensions(e) { 
    document.getElementById('width').innerHTML = window.innerWidth; 
    document.getElementById('height').innerHTML = window.innerHeight; 
} 

updateDimensions();

來源

2013-03-03 02:54:40

CSS：增加父寬度，如果p覆蓋的高度

回答

相關問題