There seems to be an excess of white space at the bottom of my webpage, despite my efforts to adjust margins and padding. I've inspected the elements using browser developer tools but have been unable to pinpoint the issue.
var chatResponseBox = document.getElementById('chat-response-box');
var mainBg = document.getElementById('main-bg');
var userInput = document.getElementById('user-input');
$(document).ready(function() {
$("#send-btn").click(async function(event) {
event.preventDefault();
const formData = new FormData();
const userInput = document.getElementById('user-input').value;
// Rest of the JS code goes here...
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap');
* {
font-family: 'Ubuntu', sans-serif;
}
.sidebar-bg {
background-color: #141B2A;
}
// Rest of the CSS code goes here...
HTML code and external script references go here...
Adjusting padding didn't yield the desired results for me