Css rotate div在顶部创建了空白区域

时间:2013-06-04 16:05:36

标签: c# asp.net css

我有一个div,我从垂直旋转到水平。问题是当我旋转它时会在顶部创造大空间。我想在旋转时将div堆叠在顶部。我怎样才能实现这个背景的宽度为756 x高度1250

的图像尺寸
.body
{
    width:756px;
    min-height:1250px;
    border-color:White;
    border-style:solid;
    border-width:thin;
    float:right;
    margin:0 auto;
    background-image:url("Images/bg.jpg");
    background-repeat:no-repeat;
      -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);

}

<div class="body">
<div >
<div ><h2 style="font-size:20px;"><div style="width:540px; margin-top:520px; margin-left:110px;   ">
     <asp:Label ID="lblNtitle" runat="server" 
         Text="" style="color: #000000" CssClass="style3"></asp:Label><br /><br /> 
     <asp:Label ID="lblNCompany" runat="server" Text="" CssClass="style3"> </asp:Label></div></h2></div>

    

1 个答案:

答案 0 :(得分:0)

从我可以收集的内容中,您需要切换最小高度和宽度值,因为div现在是垂直旋转而不是水平旋转。这样可以处理页面顶部的空白区域。以下是http://jsfiddle.net/fDWkr/1/

的示例

更改

width:756px;
min-height:1250px;

width:1250px;
min-height:756px;