在另一个div上堆积信息I

时间:2019-02-20 11:14:11

标签: html css

把我的脑子包在这个上...

在我们的结帐页面上,我们有一些付款方式。在其中两个选项中,我添加了一个信息i,当您将其悬停时,将出现一个包含一些信息的容器。

但是此容器落后于其他文本。

picatuh

我添加了z-index,但是问题仍然存在。

某些代码:

.infoI:hover .infoContainer {
        display: block !important;
        position: absolute;
        background: #eee;
        width: 185px;
        z-index: 999 !important;
        padding: 15px;
    }
    .infoI {
        display: inline-block;
    }
    .infoContainer {
        display: none;
    }
<div data-method="true" class="gui-payment-method gui-payment-method-service gui-is-selected">
	<label for="gui-payment-paynl-1987" class="gui-clearfix active">
		<input class="gui-left" id="gui-payment-paynl-1987" type="radio" name="payment_method" data-provider="paynl" data-method="1987" value="paynl|1987" checked="checked">
		<img class="gui-payment-method-icon" src="https://www.pay.nl/images/payment_profiles/50x32/1987.png" height="32" alt="SprayPay (in 12-36 maanden)">
		<span class="gui-payment-method-subtitle">
			<span class="gui-payment-method-price gui-right">
				Gratis
			</span>
			<span class="gui-payment-method-name sprayPayInfo">SprayPay (in 12-36 maanden)<div class="infoI"><i class="fas fa-info-circle"></i><div class="infoContainer">Bij de keuze voor SprayPay betaal je je bestelling (mogelijk tussen € 250,- en € 2500,-) in 12 maandelijkse gelijke termijnen. De definitieve acceptatie van de financiering is voorbehouden aan SprayPay. SprayPay hanteert een rentepercentage van 14%. Wil je zelf berekenen hoeveel je per maand moet betalen? Gebruik dan de rekenformule:  Aankoopbedrag x 0,08940 = maandbedrag voor 12 maanden.</div></div></span>
		</span>
	</label>
</div>

样式来自:span.gui-payment-method-price.gui-right

.gui-checkout-one-step .gui-payment-methods .gui-payment-method .gui-right {
    display: block;
    position: absolute;
    right: 0;
    top: 2px;
    margin: 0;
}

我想念什么?

谢谢!

0 个答案:

没有答案