css - 缩小时的Gridview空白
问题描述
我在asp.net 中有一个gridview。当我缩小页面时,gridview 中会出现一个空白区域,如图所示。如何解决?
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%;
}
我在 div 元素内的 gridview 上方也有 css 代码。
<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">
提前致谢。
解决方案
我找到了解决方案!我将 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;">
推荐阅读
- java - 谷歌或工具:UnsatisfiedLinkError
- elasticsearch - Elastic Search 地理空间搜索实现
- mysql - 如何在多个字段上使用 1 个过滤器发出 Laravel 雄辩的请求
- java - JDK11 中的 ZGC 名称中的字母“Z”究竟指的是什么?
- h2 - 如何在 Quarkus 应用程序中设置 H2 数据库控制台 url
- go - 使用 graph-gophers/graphql-go 包的 graphql 突变查询错误
- matomo - 使用 Matomo API 获取以某个 URL 开头的前 10 个访问页面
- javascript - 无法使用 javascript 获取 iframe 内容
- python - 线性回归:线拟合,但成本似乎增加
- php - 如何使用 php 在 WordPress 插件中回显 json 数据