Search code examples
htmlcssfont-sizefont-awesome-5

I have simply no idea what happened here, I used fontawesome


Screenshot of the Webpage

After formatting a few things in the section before (which should absoloutely not have an impact on this section) this just happened. The font-size on all of the names is 4em (h4). But somehow it is displayed as different sizes. It screwed up my spacing and placed this icon everywhere.

I am completely baffeled by what could have caused this.

<section class="panel configuration" data-section-name="configuration">
<div class="inner">
<h2>Unser Team</h2>
<p><b>Wir sind im Grunde Ihre Lieblingsleute, die auch tolle Webseiten erstellen, Logos entwerfen und Ihnen helfen, Ihr Geschäft bekannt zu machen, wir sind uns sicher, dass Sie uns mögen werden.</b></p>

<div class="rowz">
        <div class="windowz" style="background: linear-gradient(#ffffff2c, #ffffff05)">
                <div>
                    <img style="border-radius: 50%" src="img/avatar-2.jpg" width="150" height="150">
                    <h4>Luan B</h4>
                    <h3>Gründer und Designer</h3>
                    <i class="fas fa-pencil-alt"></i></i><i class="fas fa-file-code"></i>
                  </div>
            </div>

<div class="windowz" style="background: linear-gradient(#ffffff2c, #ffffff05)">
                <div>
                    <img style="border-radius: 50%" src="img/avatar-1.jpg" width="150" height="150">
                    <h4>Loris K</h4>
                    <h3>Designer</h3>
                    <i class="fas fa-pencil-ruler"></i> <i class="fas fa-swatchbook"></i>
                  </div>
            </div>

    <div class="windowz" style="background: linear-gradient(#ffffff2c, #ffffff05)">
        <div>
            <img style="border-radius: 50%" src="img/avatar-3.jpg" width="150" height="150">
            <h4>Lino P</h4>
            <h3>Backend-Developer</h3>
            <i class="far fa-file-code"></i> <i class="fas fa-code"></i>
    </div></div>
    </div>
    </div>

Thats the section. I would appreciate the help a lot. Thanks in advance.

PS the normal title and general fonts shouldn't be this big either


Solution

  • This is due to a mistake in the code. You have double < /i > closing tags in the first 'windowz' block. Remove one closing i tag and it should work.