LinkBut​​ton的中心内容

LinkBut​​ton的中心内容

本文介绍了LinkBut​​ton的中心内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

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

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

ASPX:

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


解决方案

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

HTML

 < D​​IV CLASS =divblock>
  < A HREF =级=LinkBut​​ton的方式> Lorem存有< / A>
< / DIV>

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 LinkButtodisplay 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的中心内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-15 16:02