html / css的頁腳格式和間距問題

Question

我已經通過了一個過時的網站，說實話，這有點混亂。 因此，目前我基本上只是在嘗試基礎知識，這具有挑戰性！

有問題的網頁在這里http://www.yourchesham.co.uk/online.htm

我正在嘗試在“

Previous Editions 

部分，但我似乎無法將底部內容移至頁面下，這意味着超時文字將開始重疊。

我試過簡單地使用<br><br>將頁面內容下推，但這是行不通的。 主要代碼塊如下所示。 不確定如何解決？

        <div id="apDiv19">
            <div align="center" class="style21">
                <h4>Support the Businesses <br />
                    that support <span class="style17">yourAmersham</span></h4>
                </div>
            </div>
            <div id="apDiv22">Registered in 'England and Wales' Company number 08280869</div>
            <div id="apDiv23">
                <h4>Our Latest Edition</h4>
                <div style="text-align:center;"><div style="margin:8px 0px 4px;"><a href="http://www.calameo.com/books/0052756020d65a0443ab5" target="_blank">Your Amersham Issue 51 October 2017</a></div><iframe src="//v.calameo.com/?bkcode=0052756020d65a0443ab5&mode=mini" width="480" height="300" frameborder="0" scrolling="no" allowtransparency allowfullscreen style="margin:0 auto;"></iframe><div style="margin:4px 0px 8px;"><a href="http://www.calameo.com/" target="_blank">Read more publications on Calaméo</a></div></div>

                <h4>Previous Editions</h4>
                <a href="http://en.calameo.com/read/00527560211169822a565" target="_blank">September Issue</a><br>
                <a href="" target="_blank">August Issue</a>
                <br>    <br>

                <!--        <div style="background-color: #333333; width: 524px"> -->

    </div>

Answer 1

問題不僅僅在於那個div，實際上幾乎所有的都是:)

所有的div都具有固定的高度和絕對的位置。 這意味着它們不會移動或增長（盡管內容會像您看到的那樣溢出div）。

為了使布局隨內容移動和增長，您需要將所有內容從絕對位置更改為相對位置。

另外，如果您只能在該頁面中定位CSS，則只需更新底部div的絕對位置即可將其移出新內容

1. 將#apDiv14的高度更改為height： #apDiv14 （即，使用最新版本的高度，假設這是您要向其添加先前版本的height:auto; ） height:auto;
2. 手動更改top以下的div的價值，以適應你添加新的內容： #apDiv7 ， #apDiv9 ， apDiv10 ， apDiv18 ， apDiv19 （！可能還有其他人）

這很麻煩，但網站本身也是如此！ :)