Html div绝对定位在不同的窗口大小或分辨率下不起作用_Html_Css

Html div绝对定位在不同的窗口大小或分辨率下不起作用

html css

Html div绝对定位在不同的窗口大小或分辨率下不起作用,html,css,Html,Css,请参阅下面的提琴代码： <body> <div style="position: relative; left: -5px; top: 18px;"><img id="ImgTachoMetre" src="/Images/u174_normal.png"/></div> <div class="report_area" style="width: 1011px;"> <table class="NNA

请参阅下面的提琴

代码：

<body>

    <div style="position: relative; left: -5px; top: 18px;"><img id="ImgTachoMetre" src="/Images/u174_normal.png"/></div>


<div class="report_area" style="width: 1011px;">





<table class="NNACorporateSectiontop">
    <tbody><tr>

        <td>
            <div class="ActionItems_wrapper row0 box bordered span4 dbBG">
                <span class="title" style="background-color: #C71444; background-image:none; color:White;"><strong>Action Items</strong></span>
                <div class="component-body">



    <div class="HotAlertRoot">


        <table class="HotAlerts" align="center">
            <tbody><tr>
                <td>Total Open
                </td>
                <td>


                    <a class="redirectLink" href="/?Length=0">177</a>
                </td>

            </tr>
            <tr>
                <td>
                    Recent: 0 - 3 Days
                </td>
                <td class="NNABoldText">
                    0
                </td>
            </tr>
            <tr>
                <td>
                    Serious: 4 - 7 Days
                </td>
                <td class="NNABoldText">
                    0
                </td>
            </tr>
            <tr>
                <td>
                    Critical: &gt; 7 Days
                </td>
                <td class="NNABoldText">
                    177
                </td>
            </tr>

        </tbody></table>

        <table class="HotAlertsDept">
            <tbody><tr>
                <td></td>
                <td>
                    Sales
                </td>
                <td>
                    Service
                </td>
            </tr>
            <tr>

                <td>Total Open 

                </td>
                <td>



                    <a href="/">65</a>
                </td>
                <td>

                    <a href="/">112</a>
                </td>
            </tr>
        </tbody></table>

        <div class="GreyArea"></div>


        <div class="CorpPerformance Alert">
            <div class="row">
                <div class="CvalPending">
                    Pending


                    <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="All" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                </div>
                <div>
                    &lt;5 Days to Edit Email

                </div>
                <div>
                    <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="All" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                </div>
            </div>
        </div>

        <table class="HotAlertsDept">
            <tbody><tr>
                <td></td>
                <td>
                    Sales
                </td>
                <td>
                    Service
                </td>
            </tr>

            <tr>

                <td>Total

                </td>
                <td>
                    <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="Sales" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                </td>
                <td>

                    <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="Service" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                </td>
            </tr>
        </tbody></table>

    </div>

                </div>
            </div>
        </td>


    </tr>
</tbody></table>

</div>
    </body>


行动项目
完全开放
最近：0-3天
0
严重：4-7天
0
关键：7天
177
销售额
服务
完全开放
悬而未决的
5天内编辑电子邮件
销售额
服务
全部的

我需要将图标放在actionitems部分的上角。请参考下面的预期图像

但在某些分辨率或窗口大小的变化中，它不对齐

未对齐的屏幕截图：

如何解决此问题？

使用“边距”而不是“左”和“上”

代码：


行动项目
完全开放
最近：0-3天
0
严重：4-7天
0
关键：7天
177
销售额
服务
完全开放
悬而未决的
5天内编辑电子邮件
销售额
<body>

    <div style="position: relative; margin: 18px 0 0 -5px; ">
        <img id="ImgTachoMetre" src="/Images/u174_normal.png"/>
    </div>


    <div class="report_area" style="width: 1011px;">





        <table class="NNACorporateSectiontop">
            <tbody>
                <tr>

                    <td>
                        <div class="ActionItems_wrapper row0 box bordered span4 dbBG">
                            <span class="title" style="background-color: #C71444; background-image:none; color:White;">
                                <strong>Action Items</strong>
                            </span>
                            <div class="component-body">



                                <div class="HotAlertRoot">


                                    <table class="HotAlerts" align="center">
                                        <tbody>
                                            <tr>
                                                <td>Total Open
                                                </td>
                                                <td>


                                                    <a class="redirectLink" href="/?Length=0">177</a>
                                                </td>

                                            </tr>
                                            <tr>
                                                <td>
                    Recent: 0 - 3 Days
                                                </td>
                                                <td class="NNABoldText">
                    0
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                    Serious: 4 - 7 Days
                                                </td>
                                                <td class="NNABoldText">
                    0
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                    Critical: &gt; 7 Days
                                                </td>
                                                <td class="NNABoldText">
                    177
                                                </td>
                                            </tr>

                                        </tbody>
                                    </table>

                                    <table class="HotAlertsDept">
                                        <tbody>
                                            <tr>
                                                <td/>
                                                <td>
                    Sales
                                                </td>
                                                <td>
                    Service
                                                </td>
                                            </tr>
                                            <tr>

                                                <td>Total Open 

                                                </td>
                                                <td>



                                                    <a href="/">65</a>
                                                </td>
                                                <td>

                                                    <a href="/">112</a>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>

                                    <div class="GreyArea"/>


                                    <div class="CorpPerformance Alert">
                                        <div class="row">
                                            <div class="CvalPending">
                    Pending


                                                <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="All" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                                            </div>
                                            <div>
                    &lt;5 Days to Edit Email

                                            </div>
                                            <div>
                                                <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="All" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                                            </div>
                                        </div>
                                    </div>

                                    <table class="HotAlertsDept">
                                        <tbody>
                                            <tr>
                                                <td/>
                                                <td>
                    Sales
                                                </td>
                                                <td>
                    Service
                                                </td>
                                            </tr>

                                            <tr>

                                                <td>Total

                                                </td>
                                                <td>
                                                    <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="Sales" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                                                </td>
                                                <td>

                                                    <a class="redirectLink" data-criteria-awaitingemailupdate="1" data-criteria-department="Service" data-criteria-reportperiod="[Collection Date].[Calendar].[Calendar Month].&amp;[February 2014]" data-criteria-summaryperiod="3MONTH" href="/Corporate/Disposition">0</a>

                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>

                                </div>

                            </div>
                        </div>
                    </td>


                </tr>
            </tbody>
        </table>

    </div>
</body>

<body>
<div>
    <div style="position: relative; left: -5px; top: 18px;"><img id="ImgTachoMetre" src="/Images/u174_normal.png"></div>


<div class="report_area" style="width: 1011px;">

</div>