Question

我想要标记为

的文字

“我希望此文本与底部窗口小部件对齐 “与底部小部件对齐。

我如何实现这一目标？ HTML - ＆gt;

<div class="albums">
<iframe class="albumWidget" src="https://widgets.itunes.apple.com/widget.html?c=no&brc=FFFFFF&blc=FFFFFF&trc=FFFFFF&tlc=FFFFFF&d=&t=&m=music&e=album&w=325&h=370&ids=258634938&wt=discovery&partnerId=&affiliate_id=&at=10lumY&ct=" frameborder=0 style="overflow-x:hidden;overflow-y:hidden;width:325px;height: 370px;border:0px; display=inline;"></iframe>

<h3>Only Built 4 Cuban Linx (1995)</h3>

<p>
"  Most cd's I buy, I get sick of in a few weeks or even days. However, this album is so perfectly balanced and groundbreaking that I get chills everytime I listen to it. When I listen to it, it just boggles my mind. " -- A customer
</p>
<p>
“ Beats by RZA are sharp like a razor.  ” -- A. Sidletsky
</p>
</div>

<div class="albums">
<iframe class="albumWidget" src="https://widgets.itunes.apple.com/widget.html?c=no&brc=FFFFFF&blc=FFFFFF&trc=FFFFFF&tlc=FFFFFF&d=&t=&m=music&e=album&w=325&h=370&ids=328405814&wt=discovery&partnerId=&affiliate_id=&at=10lumY&ct=" frameborder=0 style="overflow-x:hidden;overflow-y:hidden;width:325px;height: 370px;border:0px;"></iframe>

<p>I want this text aligned with the bottom widget</p>
</div>

CSS - ＆gt;

.albums { 

}
iframe.albumWidget {
  float:right;
  clear: right;
  margin-bottom: 20px;
}

这是指向网站的链接，因此您可以查看http://raekwon.gteaay.com/discs-baby

以下是屏幕截图的链接，以我需要的方式显示网站http://raekwon.gteaay.com

Answer 1

我不知道这是否有帮助..请检查我的小提琴

http://jsfiddle.net/ayiem999/HFs2k/

.albums { 

}
iframe.albumWidget {
  float:right;
  clear: right;
  margin-bottom: 20px;
}

p{
float:right;
  clear: right;
  margin-bottom: 20px;
}


<div class="albums">
<iframe class="albumWidget" src="https://widgets.itunes.apple.com/widget.html?c=no&brc=FFFFFF&blc=FFFFFF&trc=FFFFFF&tlc=FFFFFF&d=&t=&m=music&e=album&w=325&h=370&ids=258634938&wt=discovery&partnerId=&affiliate_id=&at=10lumY&ct=" frameborder=0 style="overflow-x:hidden;overflow-y:hidden;width:325px;height: 370px;border:0px; display=inline;"></iframe>

<h3>Only Built 4 Cuban Linx (1995)</h3>

<div>
"  Most cd's I buy, I get sick of in a few weeks or even days. However, this album is so perfectly balanced and groundbreaking that I get chills everytime I listen to it. When I listen to it, it just boggles my mind. " -- A customer
</div>
<div>
“ Beats by RZA are sharp like a razor.  ” -- A. Sidletsky
</div>
</div>

<div class="albums">

<iframe class="albumWidget" src="https://widgets.itunes.apple.com/widget.html?c=no&brc=FFFFFF&blc=FFFFFF&trc=FFFFFF&tlc=FFFFFF&d=&t=&m=music&e=album&w=325&h=370&ids=328405814&wt=discovery&partnerId=&affiliate_id=&at=10lumY&ct=" frameborder=0 style="overflow-x:hidden;overflow-y:hidden;width:325px;height: 370px;border:0px;"></iframe>
 <p class="hi">I want this text aligned with the bottom widget</p>

</div>

Answer 2

这个有效！它使用类（可重用，一次写入并在需要的地方应用类），这是正确的方法。

.albums { 
  position: absolute;
}
.reviews {
  float: left;
  height: 50%;
  width: 50%;
}
.albumWidget {
  height: 50%;
  width: 50%;
  float: left;
}

    <section class="albums">

    <section class="reviews">
    <h3>Only Built 4 Cuban Linx (1995)</h3>
    <p>
    "  Most cd's I buy, I get sick of in a few weeks or even days. However, this album is so perfectly balanced and groundbreaking that I get chills everytime I listen to it. When I listen to it, it just boggles my mind. " -- A customer
    </p>
    <p>
    “ Beats by RZA are sharp like a razor.  ” -- A. Sidletsky
    </p>
    </section>
    <iframe class="albumWidget" src="https://widgets.itunes.apple.com/widget.html?c=no&brc=FFFFFF&blc=FFFFFF&trc=FFFFFF&tlc=FFFFFF&d=&t=&m=music&e=album&w=325&h=370&ids=258634938&wt=discovery&partnerId=&affiliate_id=&at=10lumY&ct=" frameborder=0 style="overflow-x:hidden;overflow-y:hidden;width:325px;height: 370px;border:0px;"></iframe>


    <section class="reviews">
    <h3>Only Built 4 Cuban Linx II (2009)</h3>
    <p>" Raekwon's sound takes listeners back to gritty Shaolin of the 1990s; however, the production does not sound like leftover beats from that era. Instead, it is a fresh, new take on NYC street life and drama. " -- Intellectualista </p>
    </section>
    <iframe class="albumWidget" src="https://widgets.itunes.apple.com/widget.html?c=no&brc=FFFFFF&blc=FFFFFF&trc=FFFFFF&tlc=FFFFFF&d=&t=&m=music&e=album&w=325&h=370&ids=328405814&wt=discovery&partnerId=&affiliate_id=&at=10lumY&ct=" frameborder=0 style="overflow-x:hidden;overflow-y:hidden;width:325px;height: 370px;border:0px;"></iframe>


   </section>

如何将组文本与单独的窗口小部件对齐

2 个答案: