HTML/CSS不可链接图像&；不可复制文本

好的，我有一个图像，当你点击时，你会转到某个url（直接链接或类似的东西） 还有一个盒子下面有文字， 由于某些原因，图像不可单击，并且无法复制包含以下文本的框（文本当然不是框）

图像很好，可以点击，直到我用CSS定位它，然后它就不工作了， 下面的文本框也使用CSS定位 但我不知道为什么这会使它无法点击和复制 这是图像和文本框的css

    }
#left{
width:120px;
height:auto;
float:left;
margin-top:10px;
margin-left:150px;
}

下面是图像和文本框的HTML代码

    <div id="left"> <a href="user.php" target="_blank" align="right"><img src="img/acc.png"></a></div>
<br><br><br><br><br><br>
<div id="boxes">
<div id="left">
<div id="box-top-green">Users & Ranks</div>
<div id="box-centro">
                    <p>MxS II Tankz (Leader)
                    </p>MxS II Tacks (Co Leader)
                    <p> MxS II xTech (Tech) 
                    </p> MxS II --- 
                    <p> MxS II --- 
                    </p> MxS II --- 
                    <p> MxS II --- 
                    </p>MxS II --- 
                    <p> MxS II --- 
                    </p> MxS II --- 
                    <p> MxS II ---
</div>
<div id="box-abajo"></div>





</div>

Index.css

body{
margin-top:0;
margin:auto;
background-image:url(../img/bg.png);
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}
@font-face {
    font-family:Volter;
    src: url(./volter.ttf);
}

.menu{ display: inline;}
.menu{padding:8px 8px 14px 6px; color: #FFF; text-decoration: none; font-family:Volter; font-size:9px; text-shadow: 0px -1px #000000, 0px 0px #000000, 0px 0px #000000;}

#header{
background-image:url(../img/banner.png);
width:100%;
height:89px;
margin:auto;
}
#nav{
background-image:url(../img/nav.png);
width:97.6%;
height:20px;
margin:auto;
font-family:Volter;
color:#000000;
padding-top:10px;
padding-left:30px;
}
#footer{
background-image:url(../img/footer.png);
width:3336;
height:27px;
margin:auto;
font-family:Volter; font-size:9px; color:#FFFFFF; text-transform:uppercase;
text-shadow: 1px 1px #000000, -1px -1px #000000, 1px -1px #000000, -1px 1px #000000;
padding-left:8px; padding-top:8px;
}

我为您制作了一把小提琴，以帮助其他人将问题形象化。我已将图像URL更改为公共内容。如果您觉得有必要，请随意编辑此小提琴。埃里克·莫兰德。

---

嗯，也许我已经找到了解决这个问题的办法

我已经更改了HTML结构，所以我在图像上放置了一个没有链接的链接（带有文本）

图像位于content div的后面，添加了css

背景图像：

这是HTML结构：

<div class="text">
   <a href="#">Text copy here</a>
</div>

无论如何，请看。
我觉得问题来自这样一个事实，即您的左div与标题div的第一个子项重叠。第一个子项（我们称之为TheDiv）绝对定位，顶部为46像素，左侧为50像素。它包含一个600像素宽、585像素高的div（#右），左边距为510px。因此，通过布局引擎，IV的尺寸为1110px（600+510）x 710px（585+loooot of

）

由于绝对定位，它与位于这个1110 x 710px的巨大矩形内的任何东西重叠

不幸的是，我认为您的布局有严重缺陷。
您在该文本上有一个绝对定位的div

#header>div
具有此css

position:absolute; top:46px; left:50px

应该是

position:absolute; top:46px; left:560px


它有一个子项（
#right
），左边距为510px。应该是0

如果上面有另一个div，而你只是看不到它，请使用开发工具进行检查。我不这么认为，我将添加整个代码；）那是同一个文件/页面吗？你在页面中间有奇怪的身体和头标签。你确定这是全部代码吗？除了奇怪的头部和身体标签，似乎没有什么问题。Serigo，我不这么认为，因为“MXS-成为EXPERIANCE的一部分”框可以复制，在相同的“标签”Putvande中，css旁边的所有代码都想看到css吗？
.text {
border:1px solid black;
width:300px;
height:200px;
display:table;
background-image:url(http://www.starcoppe.it/images/grafica-immagine-b.jpg);
background-size:300px 200px;
}

.text a{
content:'';
display:table-cell;
margin:0 auto;
vertical-align:middle;
text-align:center;
text-decoration:none;
color:black;
}

position:absolute; top:46px; left:50px

position:absolute; top:46px; left:560px