所以我正在开发一个移动微型网站，也就是说，我希望页面上的链接表现得像 ios 链接/标签一样，当你点击它们时，按钮的整个宽度都是活动的，并改变颜色来显示单击/手指在状态等上。加上该 div 的整个宽度就像一个按钮，因此在小型手机或平板电脑上，只要我没有指定宽度，它的活动状态就会从左到一直都是“块”
例如，如果我有一个常规的文本链接。像这样：
<div class="mainBtns"><a href="gallery.php">Portfolio</a></div>
id 给它这个 CSS，以便在鼠标悬停/单击手指等时，它的行为类似于 ios 按钮/选项卡。
CSS:
.mainBtns a{
display:block;
}
.mainBtns a:hover{
background-color:#d8d3cb;
}
现在说了算。这是我试图解决的问题。
我有一个名为thumbItemW的父 Div （内容包装器）；和两个名为galThumb和galThumbtxt 的子项
内容块如下所示：
<div class="thumbItemW ">
<div class="galThumb">
<a href="gallery-highrise.php" alt=""><img src="images/thumbs/highrise.jpeg" alt="High rise Gallery" />
</a>
</div> **//this is the gallery thumb floated left**
<div class="galThumbTxt">
<a href="gallery-highrise.php" alt="">HIGH RISE CONTEMPORARY</a>
</div>**//this is the gallery thumb text floated right**
<div class="clearEm"> </div>//clear the float
</div> <!-- thumbItemW ender -->
我想要做的是，当用户手指单击父 div 时，背景颜色会像上面的示例一样发生变化"mainBtns / mainBtns a:hover"
问题是，与 mainBtns 的第一个示例不同，因为这个有子项，如果我执行以下操作：
pseudo CSS:
.thumbItemW a:hover{
display:block;
}
或类似的东西，这不会像 id 想要的那样工作，因为元素是在这个父 div 中浮动的。
我想要做的是使父 div .thumbItemW像一个显示块，这样当用户单击时，他们可以沿该 div 宽度单击任何位置并仍然激活按钮，而不是单击按钮顶部的 RIGHT 或文本。
这可以按照我的方式实现吗？这可以在没有 javascript/jquery 的情况下单独使用 CSS 来实现吗？
希望它不会太混乱。