ULセクションが混乱しています

Question

<ul>リストをインラインボックス内に並べる方法を理解しようとしています。私は内容がある4つのボックスがあり、中央のものは完璧ですが、左右のものは不均一です。

私はHTMLとCSSの初心者ですので、私は本当に何をすべきか混乱しています。

What it looks like on Firefox

これは私がCSSに持っているものです：

.floating-box { 
    float: left; 
    width: 205px; 
    height: 120px; 
    margin: 20px; 
    border: 1px solid #3B88AD; 
    padding-left:20px; 
    padding-bottom: 165px; 
    padding-right: 20px; 
    background-color: #f2f2f2; 
    font-family: open sans; 
    font-size: 15px; 
    color: black; 
} 

h1{ 
    padding-left: 20px; 
    padding-top: 20px; 
    font-family: open sans; 
    text-shadow: 3px 1px #cccccc; 
} 

p { 
    padding-left: 20px; 
    font-family: open sans; 
} 

#skills{ 
    color: black; 
} 

これは私のHTML形式です：

<div class="floating-box"><h4>Brand Identity</h4> 
<p>Visual identity such as: 
    <ul> 
     <li id="skills">Letterheads</li> 
     <li id="skills">Business cards</li> 
     <li id="skills">Brand guides, and </li> 
     <li id="skills">logos</li> 
     <li id="skills">Research &amp identity</li> 
    </ul> 
</p></div> 
<div class="floating-box"><h4>Package Design</h4> 
    <p> 
    <ul> 
     <li id="skills"> Creating visually appealing and striking design.</li> 
     <li id="skills"> Follwing the clients brief on their brand essence, 
     target audience, user personas, and color scheme.</li> 
    </ul> 
    </p></div> 

<div class="floating-box"><h4>Web Design</h4> 
    <p> 
    <ul> 
     <li id="skills"><b>User Interface (UI) Design &amp User Experience 
     (UX):</b> 
     Analyzing how people navigate through a site, or app.</li> 
     <li id="skills"><b>Interactive Design:</b> Creating mobile apps, 
     banner ads, &amp social media assets.</li> 
    </ul> 
    </p></div> 

<div class="floating-box"><h4>Communcation Design</h4> 
    <p>Designing marketing material such as: 
    <ul> 
     <li id="skills">Flyers</li> 
     <li id="skills">Brochures</li> 
     <li id="skills">Postcards</li> 
     <li id="skills">and Posters</li> 
    </ul></p> 
</div> 

Answer 1

このコードはで私のラップトップで正常に動作しますクロムとサファリ。他のブラウザでうまく動作すれば、他のブラウザを試してみてください。Firefoxでは問題があります。