asp gridview css边框超出范围

以下是gridview的css和asp代码。边界正在蔓延，然后预计。我尝试设置Width = 100％哪些工作，但我希望边界遵循网格的大小，而不是传播网格视图占用空间不必要的。asp gridview css边框超出范围

这是一个ASP的GridView用CSS四舍五入的角落

CSS：

.rounded-corners { 
     border: 1px solid #565656; 
     -webkit-border-radius: 8px; 
     -moz-border-radius: 8px; 
     border-radius: 8px; 
     overflow: hidden; 
} 


    .Grid td, .Grid th { 
     border: 1px solid #565656; 
     text-align: center; 
     padding-top: 3.5px; 
     padding-bottom: 3.5px; 
     font-size: medium; 
     font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande',  'Lucida Sans', Arial, sans-serif; 
    }

源代码：

<div class="rounded-corners"> 
<div> 
<table class="Grid" cellspacing="0" rules="all" border="1" style="border-collapse:collapse;"> 
<tbody> 
<tr> 
<th>Description</th> 
<th>Time</th> 
<th>Time</th> 
</tr> 
<tr> 
<td>abc</td> 
<td>07:30</td> 
<td>07:30</td> 
</tr> 
<tr> 
<td>def</td> 
<td>07:30</td> 
<td>07:30</td> 
</tr> 
<tr> 
<td>ghi</td> 
<td>07:30</td> 
<td>07:30</td> 
</tr> 
</tbody> 
</table> 
</div> 
</div>

来源

2017-07-12 The Novice Programmer

生成的html看起来像什么？ – realbart

我已将图像放在顶部。我不知道为什么它没有显示内联。它的一个超链接说：“这是一个用于倒角的CSS的Asp Gridview”@realbart –

我看到了图像，但我不记得asp.net gridview生成的html是什么。您应该在浏览器中查看生成的html，并将其用于样式。尝试显示：内嵌块 – realbart

我认为网格呈现：

<div class="Grid" id="XXXX_gv1"> 
<table> 
<tr><th>column 1</th><th>column 2</th><th>column 3</th></tr> 
<tr><td>value 1</td><td>value 2</td><td>value 3</td></tr> 
<tr><td>value 1</td><td>value 2</td><td>value 3</td></tr> 
</table> 
</div>

所以你可以这样：

.Grid { 
    display:inline-block; /* trick to not take 100%. */ 
    /* alternatively: you could border .Grid>table */ 
    border-radius:8px; 
} 

.Grid>table>tbody>tr:first-row { 
    /* special stuff for the first row here */ 
}

来源

2017-07-12 22:41:35 realbart

其工作兄弟谢谢，我只需要清除我的缓存。非常感谢你的帮助人。 –

如果我设置宽度的百分比，它仍然有效，但如果我将它设置为某些像素，它可以正常工作。任何解决方案？ –

asp gridview css边框超出范围

回答

相关问题