【问题标题】:Help with an absolutely positioned image css stuck to upper left of browser帮助固定在浏览器左上角的绝对定位图像 css
【发布时间】:2009-10-23 16:12:03
【问题描述】:

我是所有 css 的初学者,我反复尝试将图像(透明 png)放置在居中的表格上,但由于某种原因,图形不会从浏览器的左上角移动。绝对定位应该允许我将元素放置在我想要的任何地方。如果有人可以帮助确定我做错了什么,我将不胜感激。

------------------------------------ html---------- --------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>Welcome to Knock on Wood Productions!<title>
<link rel="stylesheet" type="text/css" href="css/style.css" media="all" />

</head>

<body>
<div id="branch">

</div>

    <table width="803" border="0" cellpading="0" cellspacing="0" align="center">
    <tr>

        <!-- The 1st nested table starts here. -->

        <td width="355" height="180" background= "images/grn1.png">
 </td>
        <td width="10" height="180" background= "images/grn2.png"></td>
        <td width="438" height="180" background= "images/grn3.png"></td>
    </tr>    
    </table>

</body>

</head>

------------------------------------ css ---------- --------------------------

body                {   background-color: #fff8a7;

                       }

#wrapper         {  position: absolute; width: 803;
                        margin-left: auto ;
                         margin-right: auto ;


                      }

#branch          {  position: absolute; width: 548;
                    top: 60;
                        left: 50;
        /* background-image: url(images/gbranch.png); */
        z-index: 2;
                      }

td                { border: solid thin red;

【问题讨论】:

  • 请将代码缩进 4 个空格。
  • 我试图遵循这一点,但我只是把整个事情搞砸了。大声笑!

标签: css html absolute


【解决方案1】:

给父元素(在你的情况下是居中的表格)一个“位置:相对”。

【讨论】:

    【解决方案2】:

    您为 width、top 和 left 属性指定了不带单位的长度。你应该写:

    #分支{
       宽度:548px;
       顶部:60px;
       左:50px;
    }

    您可能还想为该元素指定一个高度。

    【讨论】:

      【解决方案3】:

      Fumblr 的权利 - 声明高度至少等于图像的高度。 Fumblr 的代码应该可以工作。

      @Fumblr - 我想给你竖起大拇指,但我还不允许!

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2012-04-10
        • 1970-01-01
        • 2013-07-30
        • 2013-05-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-11-30
        相关资源
        最近更新 更多