出现 CSS 三 Angular 形，不应为 : Why Is this?

Question

Wifi 名称 1、Wifi 名称 2 和 Wifi 名称 3 都共享同一个名为 wifiarea 的类。 wifiarea 的 css 很简单:

.wifiarea {
    height: 115px;
    width: 561px;
}

每个按钮都有默认状态和激活状态。例如“Wifi 名称 1 文本”右侧的按钮是:

.wifibutton1>button{
    background:url(../toggle_off.png);
    border:0;
    width:191px;
    height:76px;
    float:right;
    margin-right:10px;
}

.wifibutton1>button.wifibutton1active{
    background:url(../toggle_on.png);
}

HTML:

<div class="fullairwifimenu" id="fullairwifimenu">

    <div class="wifiarea">
        <div class="wifitext">
        Wifi Name 1
        </div>
        <div class="wifibutton1">
            <button id="wifibutton1">
            </button>
        </div>
    </div>

    <div class="wifiarea">
        <div class="wifitext">
        Wifi Name 2
        </div>
        <div class="wifibutton2">
            <button id="wifibutton2">
            </button>
        </div>

    </div>

    <div class="wifiarea">
        <div class="wifitext">
        Wifi Name 3
        </div>
        <div class="wifibutton3">
            <button id="wifibutton3">
            </button>
        </div>
    </div>
</div>

处理背景的图片是popup_wifi2.png，看这里:

经过一些研究，边界似乎是问题的根源。

目标/问题:如何摆脱那个讨厌的灰色小三 Angular 形？在 css 中调用的关联图像都没有。

欢迎任何意见。

Answer 1

很确定你的背景是重复的:

background-repeat: no-repeat