none
垂直線の表示方法 RRS feed

  • 質問

  • いつもお世話になっております。
    ASP+VB.NETの環境でWebアプリを開発しています。

    画面を縦に2分割しなくてはいけない仕様で2分割は1行2列のテーブルを作成することにより実現することができました。
    (テーブルの各セルにはそれぞれTreeViewとDataListを配置してTreeViewで選択した項目によりDataListで表示する内容が変わる仕様です。)

    TreeViewとDataListの間に垂直線を表示する必要がありテーブルを1行3列に変更して
    2列目のセル内に<hr>タグのコードを追加しましたが縦方向の長さがウィンドウの高さにフィットせず上手く表示できませんでした。
    ツールにはHorizontalRuleしかないためどのように垂直線を実現したらよいか不明な状態です。


    <table class="style19">
    
        <tr>
    
            <td class="style20" align="left">
    
                <asp:TreeView ID="TreeView1" runat="server" AutoGenerateDataBindings="False" 
    
                    PopulateOnDemand ="True" ShowExpandCollapse="False" 
    
                    Width="150px" Font-Underline="True" ForeColor="#0000CC" >
    
                    <ParentNodeStyle Font-Bold="False" />
    
                    <HoverNodeStyle Font-Underline="True" ForeColor="#5555DD" />
    
                    <SelectedNodeStyle Font-Underline="True" ForeColor="#5555DD" 
    
                        HorizontalPadding="0px" VerticalPadding="0px" />
    
                    <NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="#0000CC" 
    
                        HorizontalPadding="0px" NodeSpacing="0px" VerticalPadding="0px" 
    
                        ImageUrl="~/img/folder.gif" />
    
                </asp:TreeView>
    
            </td>        
    
            <td>
    
            <hr size="5000" width="2" color="gray"/>
    
            </td>
    
            <td class="style21">
    
                <asp:DataList ID="DataList1" runat="server" RepeatColumns="4" 
    
                    RepeatDirection="Horizontal" Font-Size="11pt" ShowFooter="False" 
    
                    Visible="False" Width="800px" BorderColor="Gray" 
    
                    BorderStyle="None" Font-Bold="False" 
    
                    Font-Italic="False" Font-Overline="False" Font-Strikeout="False" 
    
                    Font-Underline="True" BorderWidth="2px" CellPadding="3" 
    
                    ForeColor="#FF6600" >              
    
                     
    
                    <SelectedItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" 
    
                        Font-Strikeout="False" Font-Underline="False" Wrap="False" />
    
                     
    
                    <HeaderStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" 
    
                        Font-Strikeout="False" Font-Underline="False" Wrap="False" />
    
                    <ItemTemplate> 
    
                           <%# Container.DataItem %>
    
                    </ItemTemplate> 
    
                    <EditItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" 
    
                        Font-Strikeout="False" Font-Underline="False" Wrap="False" />
    
                    <AlternatingItemStyle Font-Bold="False" Font-Italic="False" 
    
                        Font-Overline="False" Font-Strikeout="False" Font-Underline="False" 
    
                        Wrap="False" />
    
                    <ItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" 
    
                        Font-Strikeout="False" Font-Underline="False" Wrap="False" 
    
                        VerticalAlign="Middle" Width="240px" Font-Size="11pt" 
    
                        HorizontalAlign="Left" ForeColor="#FF6600" />
    
                  </asp:DataList>
    
            </td>
    
        </tr>
    
    </table>
    
    


    どなたか垂直線の表示方法について参考サイトやアドバイスなどいただけませんでしょうか。
    よろしくお願い致します。
    2009年4月30日 6:13

回答

  • 2列目の背景色をgrayにして、2列目の幅を狭くしてしまえばいいんじゃないでしょうか?


    ★良い回答には回答済みマークを付けよう! わんくま同盟 MVP - Visual C# http://blogs.wankuma.com/trapemiya/
    2009年4月30日 6:40
    モデレータ

すべての返信

  • 2列目の背景色をgrayにして、2列目の幅を狭くしてしまえばいいんじゃないでしょうか?


    ★良い回答には回答済みマークを付けよう! わんくま同盟 MVP - Visual C# http://blogs.wankuma.com/trapemiya/
    2009年4月30日 6:40
    モデレータ
  • trapemiyaさま

    ご回答ありがとうございます!
    仰るとおりですね!
    ご教授いただきました方法で実現したいと思います。
    ありがとうございました!
    2009年4月30日 7:02