LinkBut​​ton的中心内容 [英] center content of linkbutton

问题描述

我有一个div里面一个LinkBut​​ton。我已经设置了高度和放大器;在div的宽度看起来像使用CSS一个正方形。我还设置高度和放大器;通过CSS的LinkBut​​ton的宽度。也是我LinkBut​​to
显示属性格式设置为阻止。（要获得所有在控制超链接的效果）。
我现在想要的是垂直和水平居中LinkBut​​ton的文本。

我试图DIV和LinkBut​​ton的所有可能的属性，没有运气。
只有这样，我能做到这一点是设置填充（前，左，右），但随后食堂的布局。

  .divblock
 {
     背景色：#EEEEEE;
     边界：2px的固体;
     宽度：90像素;
     高度：80px;
 } .Linkbutton
 {
     文字修饰：无;
     ！颜色：黑重要;
     显示：块;
     宽度：85px;
     高度：80px;
}
 

ASPX：

 ＆LT; D​​IV ID =myDiv=服务器＆GT;            ＆LT; ASP：DataList控件ID =DL1=服务器RepeatDirection =水平ItemStyle-的CssClass =项目ItemStyle-Horizo​​ntalAlign =中心＆GT;
                ＆LT;＆ItemTemplate中GT;
                    **＆LT; D​​IV CLASS =divblock＆GT; **
                    ＆LT; ASP：LinkBut​​ton的**的CssClass =LinkBut​​ton的**按需=presItems_CommandID =TestLB1=服务器文本=测试/＆GT;
                   ＆LT; / DIV＆GT;
                 ＆LT; / ItemTemplate中＆GT;
＆LT; / ASP：DataList控件＆GT;
＆LT; / DIV＆GT;
 

解决方案

下面是一个解决方案，可能会为你工作：

演示小提琴

HTML

 ＆LT; D​​IV CLASS =divblock＆GT;
  ＆LT; A HREF =级=LinkBut​​ton的方式＆gt; Lorem存有＆LT; / A＆GT;
＆LT; / DIV＆GT;
 

CSS：

  .divblock {
     //其他款式     显示：表;
     文本对齐：中心;
 } .linkbutton {
     //其他款式     显示：表细胞;
     垂直对齐：中间;
}
 

I have a linkbutton inside a div. I have set the height & width of the div to look like a square using css. I have also set height & width of linkButton via css. Also my LinkButto display propery is set to block.(To get the hyperlink effect all over the control). what I want now is to center the LinkButton text vertically and horizontally.

I tried all possible properties of div and linkbutton with no luck. Only way I could do this was setting padding(top, left, right) but then it messes up the layout.

 .divblock
 {
     background-color :#EEEEEE;
     border:2px solid;
     width : 90px;
     height :80px; 
 }

 .Linkbutton
 {
     text-decoration: none ;
     color :black  !important;
     display:block;
     width : 85px;
     height :80px;
}

aspx:

<div id="myDiv" runat="server">

            <asp:DataList ID="dl1"  runat="server" RepeatDirection="Horizontal"      ItemStyle-CssClass ="Items"  ItemStyle-HorizontalAlign="Center">
                <ItemTemplate>
                    **<div class ="divblock">**
                    <asp:LinkButton **CssClass="Linkbutton"** OnCommand="PresItems_Command"     ID="TestLB1" runat="server" Text="Test" />
                   </div> 
                 </ItemTemplate>
</asp:DataList>
</div>

解决方案

Here is one solution that may work for you:

Demo Fiddle

HTML:

<div class="divblock">
  <a href="" class="linkbutton">Lorem ipsum.</a>
</div>

CSS:

.divblock {
     //other styles

     display: table;
     text-align: center;
 }

 .linkbutton {
     //other styles

     display: table-cell;
     vertical-align: middle;
}

这篇关于LinkBut​​ton的中心内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！