Simple span tag not showing text

Viewed 38

All my span tags are not working no matter how hard I tried changing its style in css. These are some of the spans that does not want to show in the website.

.blog-text span{
    color: mediumpurple;
    font-size: 0.9rem;
}
/*------------------*/
.contentcol{
    flex-basis: 48%;
    margin-bottom: 30px;
}
.contentcol div{
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}
.contentcol div .fa{
    font-size: 28px;
    color: #e5abf5;
    margin: 10px;
    margin-right: 30px;
}
.contentcol div p{
    padding: 0;
}
.contentcol div h5{
    font-size: 20px;
    margin-bottom: 5px;
    color: #555;
    font-weight: 400;
}
.contentcol input, .contentcol textarea{
    width: 100%;
    padding: 15px;
    margin-bottom: 17px;
    box-sizing: border-box;
    border: none;
    outline: none;
    background: #f0f0f0;
    font-weight: 2px;
}
/*------------------------*/
.blogright{
    flex-basis: 32%;
}
.blogright h3{
    background: mediumpurple;
    color: #fff;
    padding: 7px 0;
    font-size: 16px;
    margin-bottom: 20px;
}
.blogright div{
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #555;
    padding: 8px;
    box-sizing: border-box;
}
<div class="blog-text">
                <span>NEWS</span>
                <a href="#" class="blog-title">NEWS</a>
                <p>NEWS CONTENT</p>
            </div>

<!-- -------------------- -->

<div class="contentcol">
            <div>
                <i class="fa-solid fa-house"></i>
                <span>
                    <h5>address</h5>
                    <p>New York</p>
                </span>
            </div>
            <div>
                <i class="fa-solid fa-phone"></i>
                <span>
                    <h5>09123456789</h5>
                    <p>time of availability</p>
                </span>
            </div>
            <div>
                <i class="fa-solid fa-envelope"></i>
                <span>
                    <h5>university@edu.ph</h5>
                    <p>Email us your queries</p>
                </span>
            </div>
        </div>
 <!-- ------------------------ -->
 <div class="blogright">
            <h3>post categories</h3>
            <div>
                <span>business analytics</span>
                <span>21</span>
            </div>
            <div>
                <span>Excel</span>
                <span>21</span>
            </div>
            <div>
                <span>counseling</span>
                <span>21</span>
            </div>
            <div>
                <span>Meetings</span>
                <span>21</span>
            </div>
        </div>

They're just normal spans but I can't see them in my website at all. I'm not sure if its the browser I'm using or the sublime text being unregistered.

here are images of the output I'm seeing:

blog-text

contentcol

blogright

0 Answers
Related