我正在尝试将图像对齐某些文本/列表,同时图像仍然是100%高度且在div内。到目前为止,我已经接近但图像总是与div的底部重叠。这是我尝试实现的一个例子:
这是我到目前为止提出的代码,我一直在使用内联CSS但是一旦我发现它已经在一个单独的CSS中文件。任何帮助都非常感激,一直试图解决这个问题!
<div style="background: #000; width: 90%; color: #fff; margin: 0 auto; text-align:left; border: 1px solid #95403c;">
<p>
<img style="float: right; margin: 1px 1px 1px 1px; width: 355px;" src="" />
<div align="center">
<h1>Gold (proper style coming soon)</h1><br />
<clear>
<u>All Edited Videos Include:</u>
<ul style="display: inline-block; text-align: left;">
<li>60-90 Minute Interview Documentary</li>
<ul><li>B-Roll Footage</li>
<li>Incorporation of personal video clips (up to 15) and photographs (up to 125)</li>
<li>Interview Transcript</li></ul>
<li>1-2 Minute Individual Clips of Family Members </li>
<li>Up to 5 individuals will share a favorite memory with or express their love for the subject </li>
<li>5-10 Minute Prized Possession</li>
<li>The subject will share and describe their most prized possession</li>
<li>Behind The Scenes Photographs</li></ul>
</ul>
<clear>
<div style=" display: inline-block; vertical-align: top;">
<u>You Will Receive:</u>
<ul style="display: inline-block; text-align: left;">
<li>USB flash drive with all edited video files,<br /> pictures, and interview transcript</li>
<li>15 DVDs</li>
<ul><li>Customized printed DVDs</li>
<li>Customized menu and chapters</li>
<li>Hard cases with customized insert</li></ul>
</ul></div>
<div style="display: inline-block; vertical-align: top;">
<u>All Edited Videos Include:</u>
<ul style="display: inline-block; text-align: left;">
<li>Customized Titles</li>
<li>Customized Graphics</li>
<li>Music</li>
<li>Sound Design</li>
<li>Color Correction</li>
</ul>
</div>
<clear>
<br style="clear: both;" /></p>
</div>