我试图将此段落放在我的无序列表的右侧。我现在面临的问题是,右侧的文本被迫压到li以下。我设法将其放在右侧,但无法设法使它处于相同的“高度”。
该代码,如果有帮助。
img{
height: 200px;
width: 250px;
border: solid green 1px;
margin-top: 20px;
}
aside#Asid_vilkaviär{
width: 30%;
float: right;
margin-right: 150px;
}
<div class="container">
<div class="argumentbild_tjänst">
<img src="miljövänlig_städning_508502626.jpg">
<ul>
<li> Glöm dålig luft </li>
<li> Trevligare omgivning</li>
<li> Roligare vardag </li>
<li> Kompetenta och välutbildade medarbetare </li>
</ul>
<aside id="Asid_vilkaviär">
<h1> Vilka vi är </h1>
<p> Rena-Sopkärlet AB leds av företagets två grundare, Mille Tarp och Magnus Dahl. Företaget består att kunniga och skickliga medarbetare som genom åren har många lyckade
rengörningar av soptunnor bakom sig. Det är alltid kul att uppskattas för sitt arbete och vi har haft många tillfällen att njuta av nöjda kunder. </p>
</aside>
</div>
</div>
最佳答案
要将左部分保留在DIV中并将其CSS设置为#leftside {float:left; width:60%}
img{
height: 200px;
width: 250px;
border: solid green 1px;
margin-top: 20px;
}
#leftside {float:left; width:60%}
aside#Asid_vilkaviär{
width: 40%;
float: right;
}
<div class="container">
<div class="argumentbild_tjänst">
<div id="leftside">
<img src="miljövänlig_städning_508502626.jpg">
<ul>
<li> Glöm dålig luft </li>
<li> Trevligare omgivning</li>
<li> Roligare vardag </li>
<li> Kompetenta och välutbildade medarbetare </li>
</ul>
</div>
<aside id="Asid_vilkaviär">
<h1> Vilka vi är </h1>
<p> Rena-Sopkärlet AB leds av företagets två grundare, Mille Tarp och Magnus Dahl. Företaget består att kunniga och skickliga medarbetare som genom åren har många lyckade
rengörningar av soptunnor bakom sig. Det är alltid kul att uppskattas för sitt arbete och vi har haft många tillfällen att njuta av nöjda kunder. </p>
</aside>
</div>
</div>