full-width-container (2)sara template layout shift

 <div class='full-width-container'>

  <b:if cond='data:view.isHomepage'>

    <div class='home-title-wrap'><h3 class='home-title'><span>Ayurveda</span></h3></div>

  </b:if>

  <b:tag class='grid-posts' cond='data:view.isMultipleItems' name='div'>

    <b:loop index='i' values='data:posts' var='post'>

      <b:include data='post' name='postCommentsAndAd'/>

    </b:loop>

  </b:tag>

</div>

#2

/* General styles */

body {

    margin: 0;

    padding: 0;

    font-family: Arial, sans-serif;

}

.container {

    width: 90%;

    margin: 0 auto;

    overflow: hidden;

    position: relative;

    display: flex;

    flex-wrap: wrap;

}

.header,

.navbar,

.main-content,

.footer {

    width: 100%;

    box-sizing: border-box;

}

.header {

    background-color: #333;

    color: #fff;

    padding: 20px 0;

    text-align: center;

}

.navbar {

    background-color: #444;

    color: #fff;

    padding: 10px;

    text-align: center;

}

.main-content {

    width: calc(100% - 250px); /* Adjusting width for main content */

    padding: 20px;

}

.sidebar {

    width: 250px; /* Adjusting width for sidebar */

    padding: 20px;

    background-color: #eee;

}

.footer {

    background-color: #333;

    color: #fff;

    padding: 20px 0;

    text-align: center;

}

/* Media queries for responsiveness */

@media (max-width: 768px) {

    .sidebar {

        position: static; /* Reset position for responsive design */

        width: 100%; /* Set width to full for responsiveness */

    }

}