css - CSS 动态 Div 标签调整为静态 Div 标签的问题

标签 css html dynamic static tags

我在考虑静态 div 标签的动态 div 标签方面遇到了很多问题。这是我目前使用的 2 种样式:

动态 Div 标签:

div.Display {
width: 95%;
color: #333333;
margin-left: 360px;
background-color: #333333;
height: 100%;
margin-right: 0px;
float: left;
}

静态 Div 标签:

div.LoginBox {
box-shadow: 0px 0px 3px 0px #000000;
width: 350px;
height: 350px;
background-color: #F0F0F0;
border: 1px solid #DADADA;
clear: none;
float: left;
color: #000000;
margin-left: 0px;
}

我遇到的问题是动态 div 标记的大小不正确。它考虑了左边距 (360px),但它也默认为 LoginBox div 标记的底部(所以它就像占用了 350px 的上边距)。下面是div标签的实际应用:http://ordwurkz.com/

和 HTML:

<body onload="FP_preloadImgs(/*url*/'images/hover/minimize.png',/*url*/'images/click/minimize.png')">

<div class="Page" id="Page">

<div class="LoginContainer" id="LoginContainer">
<div id="divLoginTitleBar" class="TitleBar">
    Login   
    <div id="divTitleButtonBox" class="TitleButtonBox">

        <img id="LoginMinimize" alt="Button Text" onmousedown="FP_swapImg(1,0,/*id*/'LoginMinimize',/*url*/'images/click/minimize.png')" onmouseout="FP_swapImg(0,0,/*id*/'LoginMinimize',/*url*/'images/minimize.png')" onmouseover="FP_swapImg(1,0,/*id*/'LoginMinimize',/*url*/'images/hover/minimize.png')" onmouseup="FP_swapImg(0,0,/*id*/'LoginMinimize',/*url*/'images/hover/minimize.png')" src="images\minimize.png"/><img id="LoginClose" alt="Button Text" onmousedown="FP_swapImg(1,0,/*id*/'LoginClose',/*url*/'images/click/close.png')" onmouseout="FP_swapImg(0,0,/*id*/'LoginClose',/*url*/'images/close.png')" onmouseover="FP_swapImg(1,0,/*id*/'LoginClose',/*url*/'images/hover/close.png')" onmouseup="FP_swapImg(0,0,/*id*/'LoginClose',/*url*/'images/hover/close.png')" src="images\close.png"/></div>
</div>

<div id="divLoginBox" class="LoginBox">
<div id="divLoginContent" class="LoginContent">

<img alt="System Image" src="images/loginsplash.png" />

<form method="post" action="processor\login_processor.do" id="frmLogin">    

    <table id="tblLoginContent" class="LoginContent">
        <tr>
            <td>Username:</td>
            <td>
            <input maxlength="50" name="txtUsrName" size="20" type="text" /></td>
        </tr>
        <tr>
            <td>Password:</td>
            <td>
            <input maxlength="24" name="txtPassword" size="20" type="password" /></td>
        </tr>
        <tr>
            <td><input name="btnLogin" type="submit" value="Login" /></td>
            <td><input name="btnReset" type="reset" value="Reset" /></td>
        </tr>
    </table>
    </form>
</div>
<div class="PlatformVersion">V1.0.0.0</div>
</div>
</div>

<div class="Display"></div>

</div>
<div class="Footer">Contact Us | Terms of Service</div>
</body>

最佳答案

有没有可能将 .LoginBox 放在 .Display 中,然后移除 .Display 上的 margin-left,这样 .LoginBox 就可以 float 到 .Display 中内容的左侧?没有看到您的 HTML 很难说。

关于css - CSS 动态 Div 标签调整为静态 Div 标签的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12964361/

相关文章:

html - 修复 Foundation 5 中的问题

css - 如何使用 CSS flexbox 定位元素?

html - 填充覆盖稍后填充

css - 如何堆叠每个高度为 100% 的 div

c#-4.0 - C#中动态和T的实际区别是什么

html - 其他 Div 后面的 Mega 下拉菜单

javascript - HTML 表单在 Chrome 上验证,但在 Firefox 和 IE 上不验证

asp.net - 使用无序列表而不是表格会有很大的不同吗?

javascript - 添加转到使用 javascript 制作的动态表中的另一个 HTML 页面的功能

ruby-on-rails - 'dynamic'搜索的编程语言?