Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <link
</head>
<body>
  <div class='sidebar'>
  <img class='sidebar-img' src="https://c.tenor.com/BboKLr2YZsoAAAAC/ed-edd-n-eddy-cartoon-character.gif">
  </div>
   <!-- Content Section-->
   <div class='content'>
       <h2>Student Name - Ed Boy</h2>
       <p>Enrolled in Fundamentals of HTML, CSS, and Javascript.</p
       <!-- Interests section -->
       <div id='interests'>
           <h3>Interests</h3>
           <ul>
               <li>Thing 1</li>
               <li>Thing 2</li>
               <li>Thing 3</li>
           </ul>
       </div>
   </div>
</body>
</html>
 
<style>
   body {
       background: rgb(125, 198, 205);
       color: rgb(45, 45, 45);
       padding: 10px;
       font-family: arial;
    }
   .sidebar {
       margin-right: 25px;
       padding: 10px;
   }
   .sidebar-img {
       height: 300px;
   }
   .content {
       flex: 1;
       padding: 15px;
   }
   #interests {
       border: 10px beige solid;
       border-radius: 10px;
       padding: 8px;
       width: fit-content;
       min-width: 200px;
   }
   h2, h3 {
       margin: 0px;
   }
</style>
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers