HTML5 and CSS3: Building Responsive Websites

Time for action – enhancing the content section appearance with CSS

Perform the following steps to style the blog content:

1. Add whitespace on all sides of the content section with padding and margin, as follows

   .blog-content {
     padding: 15px;
     margin-bottom: 30px;
   } 

2. Separate each blog post with some whitespace and borderline, as follows:

   .post {
     margin-bottom: 60px;
     padding-bottom: 60px;
     border-bottom: 1px solid #ddd;
   }

3. Align the title to the center, adjust the title font size a little, and change the color with the following style rules:

   .post-title {
     font-size: 36px;
     text-align: center;
     margin-top: 0;
   }
   .post-title a {
     color: #333;
   }
   .post-title a:hover {
     color: #3498db;
   }

4. Below the title, we have post-meta, which consists of the post author name and ...