Divide a web page vertically and display logo of your college in left pane and logo of university in right pane.

HTML CodeTry it

<!-- Divide a web page vertically and display logo of your college in left pane and logo of university in right pane. -->

<body>
   <div class="split left">
      <div class="centered">
         <img src="https://zenprospect-production.s3.amazonaws.com/uploads/pictures/604f7bbda79c060001de3808/picture" alt="Avatar woman" />
         <h2>Punjab Institute of Management and Technology Collage</h2>
         <p>Left Side</p>
      </div>
   </div>
   <div class="split right">
      <div class="centered">
         <img src="https://ptu.ac.in/wp-content/themes/cynic/images/classic-logo.png" alt="Avatar man" />
         <h2>I. K. Gujral Punjab Technical University</h2>
         <p>Right side</p>
      </div>
   </div>
</body>

CSS CodeTry it

.split {
   height: 100%;
   width: 50%;
   position: fixed;
   z-index: 1;
   top: 0;
   overflow-x: hidden;
   padding-top: 20px;
}
.left {
   left: 0;
   background-color: rgba(0, 0, 0, 0.2);
}
.right {
   right: 0;
   background-color: rgb(0,0,0,0.5);
}
.centered {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   text-align: center;
}
.centered img {
   width: 150px;
   border-radius: 50%;
}

OutputTry it

Try it