SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Guru
    Join Date
    Dec 2008
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    position controls & div within a div

    <div runat="server" style="border: thin solid black; position: absolute; z-index: 115; left: 69px; width: 178px;
    top: 150px; float:right; height: 66px; display:none;"
    id="div1">
    <div runat="server" style="float:right;">
    <asp:Button runat="server" ID="btnok" Text="X" OnClientClick="A()"/></div>&nbsp;
    <br/>
    <div2 runat="server"> <textcontrol1></div>

    </div>

    i have above
    i want the div2 to be visible in div1 with border of div1 appearing
    currently i on the page div2 with control is visible & even button is visible but it appears as hanging with no border for div1
    i also had given background for div1 but it appears transparent

    i need as attachent shown
    Attached Images Attached Images

  2. #2
    SitePoint Enthusiast
    Join Date
    Apr 2011
    Posts
    58
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would layout the site as it needs to look before I put in the Asp.Net server controls in there. Either way the div tag does not need a runat = "server" attribute, unless you need it in the code behind.

    About your HTML, Is there a reason you are using absolute positioning?
    Not sure why you have floated the div right or used display none on the outer div. Also there is no div2 control. You might want to have its id set as div2.

    This is what I have. The experts here might have better code for you.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
        <title>TEST</title>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <style type="text/css">
            #div1
            {
            	border:solid gray 2px;
            	margin:150px 0px 0px 69px;
            	width: 300px;
            	height: 300px;
            	padding:10px
            }
            
            #div2
            {
            	clear:right;
            	border:solid black 2px;
            	margin:150px 0px 0px 69px;
            	width: 200px;
            	height: 200px;
            	padding:10px;
            	margin:auto;
            }
    
            .submit
            {
            	float:right;
            	margin:5px;
            	padding:5px;
            }
        </style>
    </head>
    <body>
    
        <div id="div1"><input type="submit" class="submit" value="OK" />
            <div id="div2" ><input type="text"  /></div>
        </div>
    </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •