April 10, 2026

Contact Form with news

<div class="container-fluid">
           <div class="bg-dark row">
                   <div class="col-sm-6 bg-new left-panel">
                       <h2>Latest News</h2>
                       <ul>
                           <li>
                                   <h4>Believe not all that you see nor half what you hear...</h4>
                                   <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. quis hic consectetur</p>
                                   <small>By: Vishvjeet Patel</small> <em>In: News, Articles</em>
                           </li>
                           <li>
                                   <h4>Believe not all that you see nor half what you hear...</h4>
                                   <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Minus tempora sapiente delectus quis hic consectetur</p>
                                   <small>By: Vishvjeet Patel</small> <em>In: News, Articles</em>
                           </li>
                           <li>
                                   <h4>Believe not all that you see nor half what you hear...</h4>
                                   <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Minus tempora sapiente delectus quis hic consectetur</p>
                                   <small>By: Vishvjeet Patel</small> <em>In: News, Articles</em>
                           </li>
                           
                       </ul>
                   </div>
                   <div class="col-sm-6 right-pannel">
                       <h2>Contact Us</h2>
                       <form action="">
                           <div class="row">
                               <div class="col-md-6">
                                   <label for="">First Name</label>
                                   <input type="text" name="" id="" class="form-control">
                               </div>
                               <div class="col-md-6"><label for="">Last Name</label> <input type="text" name="" id="" class="form-control"></div>
                           </div>
                           <div class="row"><div class="col-md-12"><label for="">Email</label> <input type="text" name="" id="" class="form-control"></div></div>
                           <div class="row"><div class="col-md-12"> <label for="">Message</label> <textarea name="" id="" cols="" rows="3" class="form-control"></textarea></div></div>
                           <div class="row">
                               <div class="col-md-12"><button class="btn btn-outline-warning btn-block btn-lg">Submit</button></div>
                           </div>
                       </form>
                   </div>
               </div>
   </div>

 

.left-panel { color: #f9f3e1; padding-bottom: 50px;}
        .left-panel h2 { margin:50px 0px;}
        .left-panel ul { list-style-type: none; margin:0; padding: 0;}
        .left-panel ul li { border-bottom: solid 1px #8b61e0; padding-bottom: 20px;}
        .left-panel ul li h4 { margin:10px 0px 10px 0px; padding: 0;}
        .left-panel ul li p { padding:0px; margin: 0px;}
        .left-panel ul li small { font-weight: 400;}
        .left-panel ul li em { margin-left: 20px;}
        .right-pannel h2 { margin:50px 0px; color:#eee;}
        .right-pannel .form-control { border-radius: 0px; margin:8px 0px; padding: 20px; line-height: 30px; border: solid 2px #ffffff5c; }
        .right-pannel label {margin: 0px; padding: 0px; color: #ccc}
        button { margin-top:20px;}
        .bg-new { background: #673ab7;}

 

Leave a Reply

Your email address will not be published. Required fields are marked *