HTML/CSS - C++ Course, Conditionals and Loops Online Editor and JavaScript Compiler

html

<!DOCTYPE html>
<html>
    <head>
        <title>(C++)++ Course</title>
        <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
    </head>
    <body>
        
       <div id="header">
            <div id="imgCont">
                <img src="https://api.sololearn.com/uploads/Modules/1051/1121.png">
            </div>
            <h2 id="title">Conditionals and Loops</h2>
        </div>
        
        <div class="courseCard">
            <div class="cardHeader">
                <p class="cardTitle">The else Statement</p>
                <span class="cardPageRef">2/8</span>
            </div>
            
            <div class="cardContent">
                <div class="cardText">
                    Nested if statements are things that I use a lot. There are just some times when an AND operator just isn't the right fit. A nested if statement, to me, is said like this: 'If this <b>and then</b> for this case, this.'
<div class="codeBox">
<div class="codeText">
<pre><span class="comment">//if this</span>
if (mark >= 50) {

css

body {
    position: relative;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
}
code {
    font-family: monospace;
    background:  #ddd;
}
.comment {
    color:  #888;
}
pre {
    margin: 0;
}
#header {
    margin: 0;
    padding: 5px;
    width: 100%;
    background:  rgb(68, 171, 203);
}
#imgCont {
    display: inline-block;
    float: left;
    width: 100px;

BROWSER

Console