2013-09-25 4 views
1

I가 사용자 컨트롤에 다음 코드를 작동하지 인라인 블록 30m 디스플레이 : 항상

테스트 코드 뒤에 코드 : 내 코드에서

protected void Page_Load(object sender, EventArgs e) 
    { 
     for (int i = 0; i < 100; i++) 
     { 
      Control myControl = LoadControl("myControl.ascx"); 
      myControl.ID = "test" + i; 
      Controls.Add(myControl); 
     } 
    } 

나는 위의 사용자 컨트롤의 여러 항목을 추가하고 내가 (각 사업부)의 "상자"를 원하는 뒤에 수평과 같이 정렬합니다 :

나는 그것이 엉망이됩니다 IIS 서버에 업로드 할 때 나는 내 dev에 컴퓨터에 로컬로 페이지를 테스트하지만, 경우에 잘 작동과 같이 수직으로 대신들을 나열

enter image description here

:

enter image description here

어떻게 해결할 수 있습니까? 소스보기에서

HTML 코드 :

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head><title> 

</title><meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 
<body style="background-color:#003366"> 
    <form method="post" action="Default.aspx" id="form1"> 
<div class="aspNetHidden"> 
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTg2Njc2NjM3M2Rk5VNtF6ySWjVFGFUfp3hHlD6Brf8kPq3gyNqaYdvPhTg=" /> 
</div> 


    </form> 
</body> 
</html> 

<head> 
    <title></title> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    display:block; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 
<div style="display:inline-block"> 
     <table id="test0_tblCell" class="RowBGImage" style="background-color:White;border-color:Black;border-width:1px;border-style:Solid;font-family:Arial;"> 
    <tr style="font-family:Arial Black;"> 
     <td class="HeaderPadding" align="left">361299</td><td class="HeaderPadding" align="right">78%</td> 
    </tr><tr> 
     <td>Type</td> 
    </tr><tr> 
     <td> 3 Days</td> 
    </tr><tr> 
     <td><span style="font:bold;font-size:xx-large;">1d 11h 30m</span></td> 
    </tr> 
</table> 
</div> 


<head> 
    <title></title> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    display:block; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 
<div style="display:inline-block"> 
     <table id="test1_tblCell" class="RowBGImage" style="background-color:White;border-color:Black;border-width:1px;border-style:Solid;font-family:Arial;"> 
    <tr style="font-family:Arial Black;"> 
     <td class="HeaderPadding" align="left">361299</td><td class="HeaderPadding" align="right">78%</td> 
    </tr><tr> 
     <td>Type</td> 
    </tr><tr> 
     <td> 3 Days</td> 
    </tr><tr> 
     <td><span style="font:bold;font-size:xx-large;">1d 11h 30m</span></td> 
    </tr> 
</table> 
</div> 


<head> 
    <title></title> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    display:block; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 
<div style="display:inline-block"> 
     <table id="test2_tblCell" class="RowBGImage" style="background-color:White;border-color:Black;border-width:1px;border-style:Solid;font-family:Arial;"> 
    <tr style="font-family:Arial Black;"> 
     <td class="HeaderPadding" align="left">361299</td><td class="HeaderPadding" align="right">78%</td> 
    </tr><tr> 
     <td>Type</td> 
    </tr><tr> 
     <td> 3 Days</td> 
    </tr><tr> 
     <td><span style="font:bold;font-size:xx-large;">1d 11h 30m</span></td> 
    </tr> 
</table> 
</div> 


<head> 
    <title></title> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    display:block; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 
<div style="display:inline-block"> 
     <table id="test3_tblCell" class="RowBGImage" style="background-color:White;border-color:Black;border-width:1px;border-style:Solid;font-family:Arial;"> 
    <tr style="font-family:Arial Black;"> 
     <td class="HeaderPadding" align="left">361299</td><td class="HeaderPadding" align="right">78%</td> 
    </tr><tr> 
     <td>Type</td> 
    </tr><tr> 
     <td> 3 Days</td> 
    </tr><tr> 
     <td><span style="font:bold;font-size:xx-large;">1d 11h 30m</span></td> 
    </tr> 
</table> 
</div> 


<head> 
    <title></title> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    display:block; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 
<div style="display:inline-block"> 
     <table id="test4_tblCell" class="RowBGImage" style="background-color:White;border-color:Black;border-width:1px;border-style:Solid;font-family:Arial;"> 
    <tr style="font-family:Arial Black;"> 
     <td class="HeaderPadding" align="left">361299</td><td class="HeaderPadding" align="right">78%</td> 
    </tr><tr> 
     <td>Type</td> 
    </tr><tr> 
     <td> 3 Days</td> 
    </tr><tr> 
     <td><span style="font:bold;font-size:xx-large;">1d 11h 30m</span></td> 
    </tr> 
</table> 
</div> 


<head> 
    <title></title> 
    <style> 
    .RowBGImage 
    { 
    background-image:url('tableBG.gif'); 
    background-repeat:repeat-x; 
    display:block; 
    } 
    td 
    { 
     padding:0px 0px 5px 0px; 
    } 
    .HeaderPadding 
    { 
     padding:0px 0px 10px 0px; 
    } 
</style> 
</head> 

.... ...... ..... 그리고 100

+1

ASP 코드가 아닌 브라우저의 결과 코드가 관심의 대상입니다. 게시 해 주시겠습니까? – HerrSerker

+0

@HerrSerker가 맞다. 때로는 ASP 컨트롤이 (전혀 관련이없는) 예제를 위해 바보 같은 방식으로 상황을 렌더링하여 라디오 버튼 목록을위한 테이블을 만든다. – jbaum012

+0

결과 코드로 HTML과 CSS를 의미합니다 – HerrSerker

답변

0

확인 문제가 보인다 때까지가는 유지 다른 브라우저 및 다른 버전과 다를 수 있습니다.

0
<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <style> 


     .RowBGImage { 
      background-image: url('tableBG.gif'); 
      background-repeat: repeat-x; 
      background-color: White; 
      border-color: Black; 
      border-width: 1px; 
      border-style: Solid; 
      font-family: Arial; 
      width: 100%; 
     } 

     td { 
      padding: 0px 0px 5px 0px; 
     } 

     .HeaderPadding { 
      padding: 0px 0px 10px 0px; 
     } 
     div.outer { 
      display: block; 
      width: 1000px; 
     } 
     div.inner { 
      display: inline-block; 
     } 
    </style> 
</head> 
<body style="background-color: #003366"> 
    <form method="post" action="Default.aspx" id="form1"> 
     <div class="aspNetHidden"> 
      <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTg2Njc2NjM3M2Rk5VNtF6ySWjVFGFUfp3hHlD6Brf8kPq3gyNqaYdvPhTg=" /> 
     </div> 

    </form> 
    <div class="outer" > 
     <div class="inner"> 
      <table id="test0_tblCell" class="RowBGImage"> 
       <tr style="font-family: Arial Black;"> 
        <td class="HeaderPadding" align="left">361299</td> 
        <td class="HeaderPadding" align="right">78%</td> 
       </tr> 
       <tr> 
        <td>Type</td> 
       </tr> 
       <tr> 
        <td>3 Days</td> 
       </tr> 
       <tr> 
        <td><span style="font: bold; font-size: xx-large;">1d 11h 30m</span></td> 
       </tr> 
      </table> 
     </div> 

     <div class="inner"> 
      <table id="test1_tblCell" class="RowBGImage"> 
       <tr style="font-family: Arial Black;"> 
        <td class="HeaderPadding" align="left">361299</td> 
        <td class="HeaderPadding" align="right">78%</td> 
       </tr> 
       <tr> 
        <td>Type</td> 
       </tr> 
       <tr> 
        <td>3 Days</td> 
       </tr> 
       <tr> 
        <td><span style="font: bold; font-size: xx-large;">1d 11h 30m</span></td> 
       </tr> 
      </table> 
     </div> 

     <div class="inner"> 
      <table id="test2_tblCell" class="RowBGImage"> 
       <tr style="font-family: Arial Black;"> 
        <td class="HeaderPadding" align="left">361299</td> 
        <td class="HeaderPadding" align="right">78%</td> 
       </tr> 
       <tr> 
        <td>Type</td> 
       </tr> 
       <tr> 
        <td>3 Days</td> 
       </tr> 
       <tr> 
        <td><span style="font: bold; font-size: xx-large;">1d 11h 30m</span></td> 
       </tr> 
      </table> 
     </div> 

     <div class="inner"> 
      <table id="test3_tblCell" class="RowBGImage"> 
       <tr style="font-family: Arial Black;"> 
        <td class="HeaderPadding" align="left">361299</td> 
        <td class="HeaderPadding" align="right">78%</td> 
       </tr> 
       <tr> 
        <td>Type</td> 
       </tr> 
       <tr> 
        <td>3 Days</td> 
       </tr> 
       <tr> 
        <td><span style="font: bold; font-size: xx-large;">1d 11h 30m</span></td> 
       </tr> 
      </table> 
     </div> 

     <div class="inner"> 
      <table id="test4_tblCell" class="RowBGImage"> 
       <tr style="font-family: Arial Black;"> 
        <td class="HeaderPadding" align="left">361299</td> 
        <td class="HeaderPadding" align="right">78%</td> 
       </tr> 
       <tr> 
        <td>Type</td> 
       </tr> 
       <tr> 
        <td>3 Days</td> 
       </tr> 
       <tr> 
        <td><span style="font: bold; font-size: xx-large;">1d 11h 30m</span></td> 
       </tr> 
      </table> 
     </div> 
    </div> 
</body> 
</html> 

. 이것을 확인할 수 있습니까? 3 div 만 원할 경우 외부 DIV의 크기를 변경하십시오. 나는 당신이 브라우저의 크기를 줄이더라도 동일하게 남아 있도록 수정 폭을 주었다.