dsemagin

css grid?
grid-auto-flow
https://youtu.be/RQ4VieRah8g?t=774

вроде то что вам нужно

в медиа проблема, у вас родитель width = 70%, а сам элемент 720px
media (max-width: 830px){
#searching {
height: 60px;
width: 720px;
border: none;
border-radius: 25px;
padding-left: 44px;
padding-right: 44px;
}
}

вместо этого

html {
			overflow: hidden;
		}
		.body{
			margin: 10px;
			padding: 10px;
			background-color: #fff;
			box-shadow: 5px 5px #CCCCCC;
			width: auto;
		  height: calc(100vh - 40px);
		  border: 1px solid #f00;
		  bottom: 40px;
		}

вот это

.body{
		  margin: 10px;
		  padding: 10px;
		  background-color: #fff;
		  box-shadow: 5px 5px #CCCCCC;
		  width: auto;
		  height: calc(100vh - 40px);
		  border: 1px solid #f00;
		  bottom: 40px;
                  overflow: hidden;
		}

@media only screen and (max-width : 992px)
{
.one {
  margin-right: 0;
}
}

ширину укажи при которой нужно отрубить марджин

<div class="mainwrapper">
        <h1>Предварительный просмотр</h1>
    <table border="1">
        <tr>
            <th>Колонка 1</th>
            <th>Колонка 2</th>
            <th>Колонка 3</th>
        </tr>
        <tr>
            <td>
                Наименование
            </td>
            <td>
                Единица измерения
            </td>
            <td>
                Цена
            </td>
        </tr>
<b></table> - тег не закрытый</b>
    </div>
<footer>

Ссылка

<div class="wrapper">
  <div class="content">
    Что либо
  </div>
</div>

.wrapper
{
  display: grid;
  height: 100vh;
  align-content: center;
}
.content{
    margin: 0 auto;
}

в css

background-position: center;
	background-size: cover;