HTML換行符無法按需工作

Question

我有一個用AngularJS開發的應用程序。 在其中一個頁面中，如果有這樣的內容：

    <h1 align="left">Name: <strong>{{View_This_Person.Name}}</strong></h1>

    <div style="width:100%">
        <table align="left">
            <tbody style="width:100%">
                <tr>
                    <td><font size="5">Status</font></td>
                    <td><font size="5">&nbsp : &nbsp</font></td>
                    <td><font size="5"><strong>{{View_This_Person.Status}}</strong></font></td>
                </tr>
                <tr>
                    <td><font size="5">Degree</font></td>
                    <td><font size="5">&nbsp : &nbsp</font></td>
                    <td><font size="5"><strong>{{View_This_Person.Degree}}</strong></font></td>
                </tr>
                <tr>
                    <td><font size="5">Address</font></td>
                    <td><font size="5">&nbsp : &nbsp</font></td>
                    <td><font size="5"><strong>{{View_This_Person.Address}}</strong></font></td>
                </tr>
                <tr>
                    <td><font size="5">Phone</font></td>
                    <td><font size="5">&nbsp : &nbsp</font></td>
                    <td><font size="5"><strong>{{View_This_Person.Phone}}</strong></font></td>
                </tr>
            </tbody>
        </table>
    </div>

    <div ng-repeat="One_Article in Articles_Results.Date track by One_Article.ISBN">
    ...
    </div>

帶有狀態，度等的表格大約占屏幕寬度的一半。

我的問題是，通過ng-repeat生成的下一個內容從表的右側而不是其下方開始。

使用<br>只能將ng-repear的開始向下移動一行，因此我需要放幾個<br>'s使其正確，由於表的高度不固定，這將導致顯示難看，並且當用戶隨應用程序寬度的變化而變化時...很好，無需多做解釋。

問題是，如何強制ng-repeat的啟動在表之后啟動？

試圖設置一個空的div，寬度介於100％之間，但沒有幫助。

有任何想法嗎？

謝謝！

Answer 1

您正在使用align="left"屬性，該屬性基本上表示float: left; 在等效的CSS中。

根據MDN的float屬性，

float CSS屬性指定一個元素應從常規流中獲取，並沿着其容器的左側或右側放置， 其中text和inline元素將環繞該容器。

這解釋了為什么將div[ng-repeat]推到右側而不是下方。

解決此問題的一種方法是按以下方式在兩個浮動div之間放置另一個div ：

<div style="clear:both;"></div>

clear:both; 這樣做是消除了float:left的影響，因此其后的任何元素都不受float影響。