JSFiddle - React, Tailwind, and code Playground

HTML

<!--container-->
<div style="width:500px">
    <div style="height:20px;width:100%">
        這是上方連結列
    </div>
    <div style="height:50px;width:100%">
        這是上方 Banner
    </div>    
    <!-- 下方內容區塊，分成左右兩欄 -->
    <div>
        <!-- 左方區域 -->
        <div style="width:298px;float:left;">
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>            
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>       
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>
            <p>左方內容段落</p>       
        </div>
        <!-- 右方區域 -->        
        <div style="width:196px;float:left;">
            <div style="width:100%;height:100px;">
                圖片1
            </div>
            <div style="width:100%;height:100px;">
                圖片2                
            </div>
            <div style="width:99%;height:100px;">
                圖片3                
            </div>            
        </div>
    </div>
</div>

CSS

div{
    border:1px solid red;
}