asp.net - 「position: relative」CSS の継承を防ぐ方法

Question

私のボディスタイルは以下のようなものです：

*
{
    padding: 0px;
    margin: 0px;
}
html, body
{
    background-color: #006F92;
    position: relative;
    direction: rtl;
    font: 9pt Tahoma, 'b yekan' , 'b homa' , 'arial' , Sans-Serif;
    color: #0061B7;
    height: 100%;
    top: 0px;
    right: 0px;
}

私の体には以下のようなフィールドセットがあります:

<fieldset id="fieldset_From">
    <legend>Web Site Names</legend>
    <asp:Label ID="lblFrom" runat="server" Text="Web Site Names" ForeColor="#00FF5A"></asp:Label>&nbsp;&nbsp;
    <telerik:RadComboBox ID="radcbFrom" runat="server" DataSourceID="sdsFrom_WebSites"
        DataTextField="From_WebSite" DataValueField="ID" EnableEmbeddedSkins="false" Skin="BlackByMe"
        ValidationGroup="A" Width="240px" LoadingMessage="Loading..." CausesValidation="False"
        MaxHeight="150px" AppendDataBoundItems="True">
        <Items>
            <telerik:RadComboBoxItem runat="server" Text="All" Value="-1" />
        </Items>
    </telerik:RadComboBox>
</fieldset>

その Telerik RadComboBox のスライダーはposition: relative;私の体に問題があります。
私は体にその位置が必要です。
RadComboBox Slider がボディからポジショニングを継承しないようにするにはどうすればよいですか?

編集:
レンダリングされた HTML:

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
    <title></title>
    <link type="text/css" rel="stylesheet" href="Styles/FromDBTotxt.css">
    <link type="text/css" rel="stylesheet" href="Skins/RadInput_Black/Input.BlackByMe.css">
    <link type="text/css" rel="stylesheet" href="Skins/RadButton_Black/Button.BlackByMe.css">
    <link type="text/css" rel="stylesheet" href="Skins/RadComboBox_Black/ComboBox.BlackByMe.css">
    <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
    <link class="Telerik_stylesheet" rel="stylesheet" type="text/css" href="/WebResource.axd?d=1uAw9jPTc2xXMWXZnwFR0WHd9WYjFZAUCOAtuqocex__v5L75EC9QiX_sCH45VnopNjopRnq8rc8IEBb3KEXdWBHUZf74tOouskOPfCOXucUYuXc1IfLchqzXDq1K-fmB_9PfPUmfdjW8QIXDn5ivw2&amp;t=634696541680000000">
    <link class="Telerik_stylesheet" rel="stylesheet" type="text/css" href="/WebResource.axd?d=13iOD6Zoftm8nqRaawCSklC8y9V9g87Y0kr5Ei4P5EElO9xRCq8xhXuPJ30Iwbwg9kiOCjehP62W8g2RapUnp9ZBxIOX0hzU9SVgbYeN9G8djxjjKGLG6WMwLTPG7F3J8Nh0QK_NxEIB1g4ijjLujSVvq2XEv0hC84UsTw08oIA1&amp;t=634696541680000000">
    <link class="Telerik_stylesheet" rel="stylesheet" type="text/css" href="/WebResource.axd?d=gLb4irI44ajzCsQ4ReOSJ8ZiF9XR9XzxjpiDIqOJXuhuP0sPMfnjAXjgO-VY4QblDmgpJh-_WxKIQiMZaQROEdEvLAiN2FXshWze-IJ9IgagNyNeDwXhyzF40PDKNRQGdHL4sKP3uvxWW5RW0EAJDg2&amp;t=634696541680000000">
    <link class="Telerik_stylesheet" rel="stylesheet" type="text/css" href="/WebResource.axd?d=F2aSoEO9Kst6ePwRmXcY64NfoYAv2uqdm1Rp5bXsLh47toZzK4udXXoUY7k8r2SQSP_Sak2wVUyqGRGFlqokdI7N0ryqScecklidHHWXBA2pio3xJ0yNVAArZyR1DmIlXzTPVjUNjsccsZ6LsfyQRQ2&amp;t=634696541680000000">
</head>
<body>
    <form id="form1" action="FromDBTotxt.aspx" method="post">
    <div style="z-index: 6000; visibility: visible; display: none; overflow: hidden;
        margin-left: 0pt; position: absolute; top: 81px; left: 482.5px; height: 121px;
        width: 240px;" class="rcbSlide">
        <div style="display: block; visibility: visible; top: -121px; left: 0px; width: 238px;"
            class="RadComboBoxDropDown RadComboBoxDropDown_BlackByMe  RadComboBoxDropDown_rtl RadComboBoxDropDown_BlackByMe_rtl"
            id="radcbFrom_DropDown" dir="rtl">
            <div style="height: 119px; width: 100%; overflow: auto;" class="rcbScroll rcbWidth">
                <ul style="list-style: none outside none; margin: 0pt; padding: 0pt;" class="rcbList">
                    <li class="rcbHovered ">All</li><li class="rcbItem ">11</li><li class="rcbItem ">aa</li><li
                        class="rcbItem ">bb</li><li class="rcbItem ">bbb</li><li class="rcbItem ">cc</li><li
                            class="rcbItem ">ccc</li></ul>
            </div>
        </div>
    </div>
    <div class="aspNetHidden">
        <input type="hidden" value=";;System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35:en-US:e71d0a15-7471-4384-9905-78bdf2047cba:ea597d4b:b25378d2;Telerik.Web.UI, Version=2012.1.411.40, Culture=neutral, PublicKeyToken=121fae78165ba3d4:en-US:ebfa5361-1bb0-4d72-bf6d-db0befdf104a:16e4e7cd:ed16cbdc:f7645509:24ee1bba:f46195d3:2003d0b8:1e771326:aa288e2d:7165f74"
            id="RadScriptManager1_TSM" name="RadScriptManager1_TSM">
        <input type="hidden" value="" id="__EVENTTARGET" name="__EVENTTARGET">
        <input type="hidden" value="" id="__EVENTARGUMENT" name="__EVENTARGUMENT">
        <input type="hidden" value="" id="__LASTFOCUS" name="__LASTFOCUS">
        <input type="hidden" value="/wEPDwUJMjE1MTIwNjQ4D2QWAgIDD2QWDAIFDw9kDxAWAmYCARYCFgIeDlBhcmFtZXRlclZhbHVlBQItMRYCHwAFB0FsbF9MYW4WAmZmZGQCCQ8PFgIeF0VuYWJsZUFqYXhTa2luUmVuZGVyaW5naGRkAg0PEGRkFgFmZAIPDxAPFgIeC18hRGF0YUJvdW5kZ2QPFgMCAQICAgMWAxAFStin24zZhiDYp9uM2YXbjNmEINmH2Kcg2qnYp9mF2YTYp9mLINmB2LnZkdin2YQg2Ygg2KrYs9iqINi02K/ZhyDZh9iz2KrZhtivBQExZxAFcNin24zZhiDYp9uM2YXbjNmEINmH2Kcg2KrZiNiz2Lcg2KfYs9m+2KfbjNiv2LHZh9inINin2LIg2YjYqCDYs9in24zYqiDZhdix2KjZiNi32Ycg2KzZhdi5INii2YjYsduMINi02K/ZhyDYp9mG2K8FATJnEAVR2KfbjNmGINin24zZhduM2YQg2YfYpyDYqtiz2Kog2LTYr9mHINmG24zYs9iq2YbYryDZiCDYqNin24zYryDYqNix2LHYs9uMINi02YjZhtivBQEzZxYBZmQCEw8UKwACDxYIHhNjYWNoZWRTZWxlY3RlZFZhbHVlZB4EVGV4dAUG2YfZhdmHHwFoHwJnZA8UKwAHFCsAAg8WBh8EBQbZh9mF2YceBVZhbHVlBQItMR4IU2VsZWN0ZWRnZGQUKwACDxYGHwQFAjExHwUFAjExHwZoZGQUKwACDxYGHwQFAmFhHwUFAmFhHwZoZGQUKwACDxYGHwQFAmJiHwUFAmJiHwZoZGQUKwACDxYGHwQFA2JiYh8FBQNiYmIfBmhkZBQrAAIPFgYfBAUCY2MfBQUCY2MfBmhkZBQrAAIPFgYfBAUDY2NjHwUFA2NjYx8GaGRkDxQrAQdmZmZmZmZmFgEFd1RlbGVyaWsuV2ViLlVJLlJhZENvbWJvQm94SXRlbSwgVGVsZXJpay5XZWIuVUksIFZlcnNpb249MjAxMi4xLjQxMS40MCwgQ3VsdHVyZT1uZXV0cmFsLCBQdWJsaWNLZXlUb2tlbj0xMjFmYWU3ODE2NWJhM2Q0Fg4CAg8PFgYfBAUG2YfZhdmHHwUFAi0xHwZnZGQCAw8PFgYfBAUCMTEfBQUCMTEfBmhkZAIEDw8WBh8EBQJhYR8FBQJhYR8GaGRkAgUPDxYGHwQFAmJiHwUFAmJiHwZoZGQCBg8PFgYfBAUDYmJiHwUFA2JiYh8GaGRkAgcPDxYGHwQFAmNjHwUFAmNjHwZoZGQCCA8PFgYfBAUDY2NjHwUFA2NjYx8GaGRkAhUPPCsABAEADxYCHwFoZGQYAgUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgIFCXJhZGNiRnJvbQUNUmFkYnRuR2V0RmlsZQUJcmFkY2JGcm9tDxQrAAIFBtmH2YXZhwUCLTFkfb9wwPpbUuCpYxSZLLpIHeyHbDPMJzu+qYSO8AdXVyE="
            id="__VIEWSTATE" name="__VIEWSTATE">
    </div>
    <script type="text/javascript">
        //&lt;![CDATA[
        var theForm = document.forms['form1'];
        if (!theForm) {
            theForm = document.form1;
        }
        function __doPostBack(eventTarget, eventArgument) {
            if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
                theForm.__EVENTTARGET.value = eventTarget;
                theForm.__EVENTARGUMENT.value = eventArgument;
                theForm.submit();
            }
        }
        //]]&gt;
</script>
    <script type="text/javascript" src="/WebResource.axd?d=cqUgLmRt1PDc02tdUmiePGftPICf3D-48hjRGcwL5K3eLKNuAYv8U2uk3XygxG-ztdx_jATxom9V7sPijlN-xLrorIsalg6DX1qib_8o31o1&amp;t=634602272469974565"></script>
    <script type="text/javascript" src="/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&amp;compress=1&amp;_TSM_CombinedScripts_=%3b%3bSystem.Web.Extensions%2c+Version%3d4.0.0.0%2c+Culture%3dneutral%2c+PublicKeyToken%3d31bf3856ad364e35%3aen-US%3ae71d0a15-7471-4384-9905-78bdf2047cba%3aea597d4b%3ab25378d2%3bTelerik.Web.UI%2c+Version%3d2012.1.411.40%2c+Culture%3dneutral%2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3aebfa5361-1bb0-4d72-bf6d-db0befdf104a%3a16e4e7cd%3aed16cbdc%3af7645509%3a24ee1bba%3af46195d3%3a2003d0b8%3a1e771326%3aaa288e2d%3a7165f74"></script>
    <script type="text/javascript">
        //&lt;![CDATA[
        if (typeof (Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.');
        //]]&gt;
</script>
    <div class="aspNetHidden">
        <input type="hidden" value="/wEWDgLqwvGUDQKX9+fxBwKZstXTDgLY3rqSDQLZ3q6SDQLisZz9AQLGn4b/DgLKn8r8DgLLn8r8DgLIn8r8DgLF8OCSAgLO85mIDQLjnNj8AwLO85mIDb7HcTY/Qfm98Hx8Gq9vgGyvxXOrQPxE9OVxUkyuieEt"
            id="__EVENTVALIDATION" name="__EVENTVALIDATION">
    </div>
    <script type="text/javascript">
        //&lt;![CDATA[
        Sys.WebForms.PageRequestManager._initialize('RadScriptManager1', 'form1', ['tsdsFrom_WebSitesPanel', '', 'tRBL_PriorityPanel', '', 'tradcbFromPanel', '', 'tRBL_LanguagePanel', '', 'tRadAjaxManager1SU', 'RadAjaxManager1SU'], ['RBL_Priority', 'RBL_Priority', 'RBL_Language', 'RBL_Language'], [], 90, '');
        //]]&gt;
</script>
    <div id="sdsFrom_WebSitesPanel" style="display: block;">
    </div>
    <!-- 2012.1.411.40 -->
    <div id="RadAjaxManager1SU" style="display: none;">
        <span style="display: none;" id="RadAjaxManager1"></span>
    </div>
    <div style="display: none;" class="RadAjax RadAjax_Black" id="RadAjaxLoadingPanel1">
        <div class="raDiv">
        </div>
        <div class="raColor raTransp">
        </div>
    </div>
    <div id="OuterDiv">
        <a href="javascript:__doPostBack('lbHome','')" class="Link" id="lbHome">خانه</a>
        <fieldset id="fieldset_From">
            <legend>Wes Site Names</legend><span style="color: rgb(0, 255, 90);" id="lblFrom">
                Wes Site Names</span>&nbsp;&nbsp;
            <div id="radcbFromPanel" style="display: block;">
                <div style="width: 240px;" class="RadComboBox RadComboBox_BlackByMe RadComboBox_rtl RadComboBox_BlackByMe_rtl"
                    id="radcbFrom">
                    <table style="border-width: 0pt; border-collapse: collapse;" summary="combobox" class="">
                        <tbody>
                            <tr class="rcbReadOnly">
                                <td class="rcbInputCell rcbInputCellRight" style="width: 100%;">
                                    <input type="text" readonly="readonly" value="All" id="radcbFrom_Input" class="rcbInput"
                                        name="radcbFrom" autocomplete="off">
                                </td>
                                <td class="rcbArrowCell rcbArrowCellLeft">
                                    <a style="overflow: hidden; display: block; position: relative; outline: medium none;"
                                        id="radcbFrom_Arrow">select</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <input type="hidden" name="radcbFrom_ClientState" id="radcbFrom_ClientState" autocomplete="off">
                </div>
            </div>
        </fieldset>
    </div>
    <script type="text/javascript" language="javascript">
        function pageLoad() {

        }

        //&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;

        $(document).ready(function () {

        });

        //&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;
        </script>
    <script type="text/javascript">
        //&lt;![CDATA[
        Sys.Application.add_init(function () {
            $create(Telerik.Web.UI.RadAjaxManager, { "_updatePanels": "", "ajaxSettings": [{ InitControlID: "RBL_Priority", UpdatedControls: [{ ControlID: "sdsFrom_WebSites", PanelID: "" }, { ControlID: "RBL_Priority", PanelID: "" }, { ControlID: "radcbFrom", PanelID: ""}] }, { InitControlID: "RBL_Language", UpdatedControls: [{ ControlID: "sdsFrom_WebSites", PanelID: "" }, { ControlID: "radcbFrom", PanelID: "" }, { ControlID: "RBL_Language", PanelID: ""}]}], "clientEvents": { OnRequestStart: "", OnResponseEnd: "" }, "defaultLoadingPanelID": "", "enableAJAX": true, "enableHistory": false, "links": [], "styles": [], "uniqueID": "RadAjaxManager1", "updatePanelsRenderMode": 0 }, null, null, $get("RadAjaxManager1"));
        });
        Sys.Application.add_init(function () {
            $create(Telerik.Web.UI.RadAjaxLoadingPanel, { "initialDelayTime": 0, "isSticky": false, "minDisplayTime": 0, "skin": "Black", "transparency": 0, "uniqueID": "RadAjaxLoadingPanel1", "zIndex": 90000 }, null, null, $get("RadAjaxLoadingPanel1"));
        });

        WebForm_InitCallback(); Sys.Application.add_init(function () {
            $create(Telerik.Web.UI.RadComboBox, { "_dropDownWidth": 0, "_maxHeight": 150, "_skin": "BlackByMe", "_text": "همه", "_uniqueId": "radcbFrom", "_value": "-1", "clientStateFieldID": "radcbFrom_ClientState", "collapseAnimation": "{\"duration\":450}", "expandAnimation": "{\"duration\":450}", "itemData": [{ "value": "-1", "selected": true }, { "value": "11" }, { "value": "aa" }, { "value": "bb" }, { "value": "bbb" }, { "value": "cc" }, { "value": "ccc"}], "loadingMessage": "در حال لود شدن ...", "localization": "{\"AllItemsCheckedString\":\"All items checked\",\"ItemsCheckedString\":\"items checked\",\"CheckAllString\":\"Check All\"}", "selectedIndex": 0 }, null, null, $get("radcbFrom"));
        });
        Sys.Application.add_init(function () {
            $create(Telerik.Web.UI.RadButton, { "_postBackReference": "", "clientStateFieldID": "RadbtnGetFile_ClientState", "iconData": {}, "imageData": {}, "text": "دریافت فایل", "toggleStatesData": [], "uniqueGroupName": "", "uniqueID": "RadbtnGetFile", "width": "150px" }, null, null, $get("RadbtnGetFile"));
        });
        //]]&gt;
</script>
    </form>
</body>
</html>

そしてすべての CSS:

*
{
    padding: 0px;
    margin: 0px;
}
html, body
{
    background-color: #006F92;
    position: relative;
    direction: rtl;
    font: 9pt Tahoma, 'b yekan' , 'b homa' , 'arial' , Sans-Serif;
    color: #0061B7;
    height: 100%;
    top: 0px;
    right: 0px;
}
input, select, option
{
    font-family: Tahoma, 'b yekan' , 'b homa' , 'arial' , Sans-Serif;
}
#OuterDiv
{
    width: 650px;
    height: 100%;
    margin: 0 auto;
}
#OuterDiv .Link:link, #OuterDiv .Link:visited
{
    color: #00FF12;
}
#OuterDiv .Link:hover, #OuterDiv .Link:active
{
    color: #F0FF00;
}
#lbHome
{
    font: bold 15px tahoma;
    position: absolute;
    top: -15px;
    right: 20px;
    text-decoration: none;
}
fieldset
{
    width: 550px;
    margin: 30px;
    padding: 15px;
}
fieldset legend
{
    color: #00eaff;
    font-weight: bold;
    font-size: 12px;
}
fieldset table label
{
    position: relative;
    top: -2px;
    right: 5px;
}
#radcbFromPanel
{
    display: inline !important;
}
#fieldset_From
{

}

フォーム要素の下のその div は、その RadComboBox のスライダーです。

前もって感謝します

score 3 · Accepted Answer

CssClass次のプロパティを使用して、カスタムコントロールに CSS クラスを明示的に追加できます。

.static-position {
    position: static;
}

<telerik:RadComboBox ID="radcbFrom" CssClass="static-position" ...>
    ....
</telerik:RadComboBox>

更新:コメントで特定の問題の解決策を見つけました。この問題は、相対的な配置が必要なの<div style="position:relative;">...</div>周りに別lbHomeのタグを配置し、 body タグのスタイルからその位置を削除することで解決されました。

score 0 · Accepted Answer

0

position : static ここを見ました。デフォルトに戻ることを願っています。

于 2012-06-15T08:24:34.107 に答える

score 0 · Accepted Answer

コントロールにインラインスタイルを追加して、親スタイルをオーバーライドします。

例:

style="position: absolute;"

ポジショニングのその他のオプションは次のとおりです。

static: 要素は、ドキュメントフローに表示される順序でレンダリングされます。これがデフォルトです。

absolute: 要素は、最初に配置された (静的ではない) 祖先要素に対して相対的に配置されます。

修正済み:要素はブラウザウィンドウに対して相対的に配置されます

relative: 要素は通常の位置に対して相対的に配置されるため、"left:20" は要素の LEFT 位置に 20 ピクセルを追加します

asp.net - 「position: relative」CSS の継承を防ぐ方法

3 に答える 3

Related

Reference