100％寬度的桌子旁邊的浮動圖像

我的問題與this question中的問題類似，該問題在一年內尚未見到。我有一張未知寬度的桌子，顯示在已知大小的圖像旁邊。容器的寬度未知。我希望圖像正確地浮動，並且表格共享一條線，擴展以填充剩餘的空間。我想這樣做沒有嵌套表（因爲eew）。我認爲它應該如此簡單：100％寬度的桌子旁邊的浮動圖像

<img src="img.jpg" style="float:right" /> 
<table style="width:100%"> 
    ... 
</table>

...但事實並非如此。這裏有一個小提琴這是接近到我想要的，只是缺少表格的寬度：http://jsfiddle.net/K2fpA/

如果可能的話，我想保持CSS3出來。如果絕對必要，我可以做一個嵌套表格，但我想確保我不會錯過任何東西。有任何想法嗎？

來源

2013-04-11 Dan Hlavenka

不知道，如果你知道，但你的內嵌樣式'浮動：right'缺少一個分號。 – vtacreative 2013-04-11 05:12:31

我知道，並且該語法不需要該分號。我通常不會在生產頁面中使用內聯樣式（或省略可選分號），但對於此問題，我想保持簡潔。 – 2013-04-11 05:28:12

步驟1.將式位置相對爲內含div。步驟2的位置是：絕對的圖像

.container img { 
position:absolute; 
right:0; 
top:0; 
} 
.container .table-div { 
position:relative; 
padding-right:'images-width'; 
} 

<div class="container"> 
    <div class="table-div"> 
    <table style="width:100%;" > 
    </table> 
    </div> 
</div>

來源

2013-04-11 08:14:25

只要在工作的圖像上使用'position：relative''和'padding-right：[xxx] px'，並且'float：right'。謝謝！ – 2013-04-13 06:11:58

嘗試將圖像放在表格之前，並將圖像和表格都浮在右邊。

<div style="float:left;"> <table style="width:100%;" > 
... 
</table> 
<div/> 
<div style="float:left;"> <img src="img.jpg" /></div>

EDITED

來源

2013-04-11 05:10:00 7alhashmi

任何時候我浮動表或其父div，表縮小到可能的最小尺寸（即使當我提供'寬度：100％'）。在px中設置寬度可以正確調整表格大小，但對我來說不起作用，因爲我需要的大小會因瀏覽器而異。 – 2013-04-11 05:32:27

100％寬度的桌子旁邊的浮動圖像

回答

相關問題