Пустое место в Gridview при уменьшении масштаба

У меня есть gridview в asp.net. Когда я уменьшаю масштаб страницы, в сетке появляется пустое пространство, как в этом изображение. Как это исправить?

Код css:

.module {
border: 1px solid #9BA0AF;
margin: 0;
margin-top: 0px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 15px;
background: #ffffff;
position:static;
height: 100%;
width:100px;
background-size: contain;
 }

.moduleheader {
height: 38px;
width: 100%;
background: #F1F1F4 url(../images/secondary_bar.png) repeat-x;
background-position: left top;
background-repeat: repeat-x;
background-size: 100% 100%;
}

У меня также есть код css над сеткой внутри элемента div.

<div style = "border: 1px solid #9BA0AF; width:30%; margin: 20px 3% 0 3%;      background-color:white;
        border-radius: 15px 15px 15px 15px;
        -moz-border-radius: 5px 5px 5px 5px;
        -khtml-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        overflow: hidden !important; position:static; background-size: 100% 100%;">
<asp:GridView ID = "GridView1" runat = "server" DataSourceID = "SqlDataSource1" AutoGenerateColumns = "false" GridLines = "None" RowStyle-Wrap = "false">

Заранее спасибо.

Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
CSS: FlexBox
CSS: FlexBox
Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.
0
0
68
1

Ответы 1

Я нашел решение! Я добавил свойство max-width в div, как показано ниже:

<div style = "border: 1px solid #9BA0AF; width:30%; margin: 20px 3% 0 3%; background-color:white;
        border-radius: 15px 15px 15px 15px;
        -moz-border-radius: 5px 5px 5px 5px;
        -khtml-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        overflow: hidden !important; position:static; background-size: 100% 100%; max-width: 500px;">

Другие вопросы по теме