我在段落旁边有一个图片，样式为float:left和float:right，因此它们会彼此相邻显示。我想在图像和段落下显示无序列表。但相反，第一个列表元素显示在图像的顶部。这是代码
<div id="Teil"style="display: inline-block">
<img src="Bilder/Bild4.jpg" width=600em style="float:left; margin:1em">
<p style="float:right; margin:1em; font-family:'Corbel'; font-size:1.7em;"> <b>Was ihr braucht:</b><br>
250 g weiche Butter<br>
100 g Zucker<br>
100 g brauner Zucker<br>
1 TL Backpulver<br>
300 g Mehl<br>
2 Stk Eier<br>
100 g gemahlene Haselnüsse<br>
100 g gehackte Walnüsse<br>
150 g Chocolate Chips<br></p>
<ol style="float:none;">
<li>Vor Beginn des Backens muss der Ofen auf 200 Grad vorgeheizt werden.</li>
<li>Anschließend wird eine Schüssel zur Hand genommen (z.B. Plastikschüssel). Darin soll die weiche Butter (kann in der Mikrowelle etwas geschmolzen werden) und die zwei Zucker Arten verrührt werden.</li>
<li>Die Eier jetzt einzeln auf höchster Stufe des Handrührgeräts unterrühren.</li>
<li>Jetzt kommen die Haselnüsse und Walnüsse ins Spiel. Diese müssen jetzt zur Masse hinzugefügt und vorsichtig untergemengt werden. Anschließend können auch die Schokotropfen untergerührt werden.</li>
<li>Ist die Masse gut verrührt, können aus dem Teig kleine Kugeln geformt werden. Die Größe erinnert an einen Tischtennisball. Die geformten Kugeln sollen jetzt mit einer Gabel flach gedrückt und auf das Backblech verteilt werden.</li>
<li>Jetzt können die Chocolate Chip Cookies auf mittlerer Schiene bei 170 Grad gebacken werden.</li>
<li>Anschließend auskühlen lassen und verzehren.</li>
</ol>
</div>
答案 0 :(得分：2)
您可以将clear:left;添加到<ol>代码。
如果您希望ol位于两个元素下方，则可以添加clear: both;。
<div id="Teil"style="display: inline-block">
<img src="https://images-gmi-pmc.edge-generalmills.com/eb52c020-c145-440c-8445-911f133c0096.jpg" width=300px; style="float:left; margin:1em">
<p style="float:right; margin:1em; font-family:'Corbel'; font-size:1.7em;"> <b>Was ihr braucht:</b><br>
250 g weiche Butter<br>
100 g Zucker<br>
100 g brauner Zucker<br>
1 TL Backpulver<br>
300 g Mehl<br>
2 Stk Eier<br>
100 g gemahlene Haselnüsse<br>
100 g gehackte Walnüsse<br>
150 g Chocolate Chips<br></p>
<ol style="float:none; clear: left;">
<li>Vor Beginn des Backens muss der Ofen auf 200 Grad vorgeheizt werden.</li>
<li>Anschließend wird eine Schüssel zur Hand genommen (z.B. Plastikschüssel). Darin soll die weiche Butter (kann in der Mikrowelle etwas geschmolzen werden) und die zwei Zucker Arten verrührt werden.</li>
<li>Die Eier jetzt einzeln auf höchster Stufe des Handrührgeräts unterrühren.</li>
<li>Jetzt kommen die Haselnüsse und Walnüsse ins Spiel. Diese müssen jetzt zur Masse hinzugefügt und vorsichtig untergemengt werden. Anschließend können auch die Schokotropfen untergerührt werden.</li>
<li>Ist die Masse gut verrührt, können aus dem Teig kleine Kugeln geformt werden. Die Größe erinnert an einen Tischtennisball. Die geformten Kugeln sollen jetzt mit einer Gabel flach gedrückt und auf das Backblech verteilt werden.</li>
<li>Jetzt können die Chocolate Chip Cookies auf mittlerer Schiene bei 170 Grad gebacken werden.</li>
<li>Anschließend auskühlen lassen und verzehren.</li>
</ol>
</div>
答案 1 :(得分：0)
将 float：left; 添加到 float：none;
的'ol'样式<div id="Teil"style="display: inline-block">
<img src="Bilder/Bild4.jpg" width=600em style="float:left; margin:1em">
<p style="float:right; margin:1em; font-family:'Corbel'; font-size:1.7em;"> <b>Was ihr braucht:</b><br>
250 g weiche Butter<br>
100 g Zucker<br>
100 g brauner Zucker<br>
1 TL Backpulver<br>
300 g Mehl<br>
2 Stk Eier<br>
100 g gemahlene Haselnüsse<br>
100 g gehackte Walnüsse<br>
150 g Chocolate Chips<br></p>
<ol style="float:left;">
<li>Vor Beginn des Backens muss der Ofen auf 200 Grad vorgeheizt werden.</li>
<li>Anschließend wird eine Schüssel zur Hand genommen (z.B. Plastikschüssel). Darin soll die weiche Butter (kann in der Mikrowelle etwas geschmolzen werden) und die zwei Zucker Arten verrührt werden.</li>
<li>Die Eier jetzt einzeln auf höchster Stufe des Handrührgeräts unterrühren.</li>
<li>Jetzt kommen die Haselnüsse und Walnüsse ins Spiel. Diese müssen jetzt zur Masse hinzugefügt und vorsichtig untergemengt werden. Anschließend können auch die Schokotropfen untergerührt werden.</li>
<li>Ist die Masse gut verrührt, können aus dem Teig kleine Kugeln geformt werden. Die Größe erinnert an einen Tischtennisball. Die geformten Kugeln sollen jetzt mit einer Gabel flach gedrückt und auf das Backblech verteilt werden.</li>
<li>Jetzt können die Chocolate Chip Cookies auf mittlerer Schiene bei 170 Grad gebacken werden.</li>
<li>Anschließend auskühlen lassen und verzehren.</li>
</ol>
</div>
答案 2 :(得分：0)
尝试这种方式@ supermaxy4。我添加了样式并改变了你的代码，希望你得到你想要的东西。
<强> HTML
<div class="container vertical-divider">
<div class="column two-fifths">
<img src="Bilder/Bild4.jpg" width=600em height=300em style="float:left; margin:1em">
</div>
<div class="column three-fifths">
<p style="float:right; margin:1em; font-family:'Corbel'; font-size:1.4em;"> <b>Was ihr braucht:</b><br>
250 g weiche Butter<br>
100 g Zucker<br>
100 g brauner Zucker<br>
1 TL Backpulver<br>
300 g Mehl<br>
2 Stk Eier<br>
100 g gemahlene Haselnüsse<br>
100 g gehackte Walnüsse<br>
150 g Chocolate Chips<br>
</p>
</div>
</div>
<div class="container vertical-divider">
<div class="column" align="left">
<ol style="float:left;">
<li>Vor Beginn des Backens muss der Ofen auf 200 Grad vorgeheizt werden.</li>
<li>Anschließend wird eine Schüssel zur Hand genommen (z.B. Plastikschüssel). Darin soll die weiche Butter (kann in der Mikrowelle etwas geschmolzen werden) und die zwei Zucker Arten verrührt werden.</li>
<li>Die Eier jetzt einzeln auf höchster Stufe des Handrührgeräts unterrühren.</li>
<li>Jetzt kommen die Haselnüsse und Walnüsse ins Spiel. Diese müssen jetzt zur Masse hinzugefügt und vorsichtig untergemengt werden. Anschließend können auch die Schokotropfen untergerührt werden.</li>
<li>Ist die Masse gut verrührt, können aus dem Teig kleine Kugeln geformt werden. Die Größe erinnert an einen Tischtennisball. Die geformten Kugeln sollen jetzt mit einer Gabel flach gedrückt und auf das Backblech verteilt werden.</li>
<li>Jetzt können die Chocolate Chip Cookies auf mittlerer Schiene bei 170 Grad gebacken werden.</li>
<li>Anschließend auskühlen lassen und verzehren.</li>
</ol>
</div>
</div>
<强> CSS
.container { position: relative; margin: 2px auto; padding: 0; }
.container .column, .container .columns { float: left; display: inline; margin-left: 10px; margin-right: 10px; }