Apologies for any language barriers...
I'm currently working on developing an E-commerce Website.
The issue I am facing is that when I click the Add to Cart (Zum warenkorb hinzufügen) button and the window pops up with the + and - icons, they are visible...
https://i.sstatic.net/Pr2pW.png
However, once the new window shifts towards the right side,
#layerPreviewContent-3 {position:absolute;z-index:1;display:none;background-color:#dedee0; margin-top: 0px;left:50%;
width:30%;
margin-left:-150px;
height:40%;
-moz-box-shadow: 5px 5px 5px rgba(68, 68, 68, 0.6);
-webkit-box-shadow: 5px 5px 5px rgba(68, 68, 68, 0.6);
box-shadow: 5px 5px 5px rgba(68, 68, 68, 0.6);
}
When margin-left:-450px; is set to move it further right,
https://i.sstatic.net/hLLoX.png
As shown in the image, the icons disappear...
My concern is how can I prevent the + and - icons from being displayed when the new window appears after clicking the Add to Cart button.
This is a snippet of my HTML code:
<div class="container">
<div class="kaufen">
<form class="form-basket" method="post" enctype="multipart/form-data">
<fieldset class="addtobasket-container">
<span class="tittle-kaufen">Rucksack aus Hanf Gelbe mit Zwei Riemen</span>
<span class="preis"> Preis 40 € </span>
<span class="piece">Stück</span>
<div class="quantity">
<input type="button" value="+" class="plus">
<input type="number" step="1" max="99" min="1" value="1" title="Qty" class="qty" size="4">
<input type="button" value="-" class="minus">
</div>
<div class="button_wrap" >
<button class="button_wrap_buttom" type="buttom" onclick='layer_show_3(event);' ><span>Zum warenkorb hinzufügen</span></button>
</div>
</fieldset>
</form>
<!-- En el momento que se pulse sobre la capa transparente se cerrara -->
<div id="layerPreview-3" > </div>
<div id='layerPreviewContent-3'>
<!-- Mostramos el texto de cerrar para poder cerrar la ventana -->
<div id="tittel-text">Rucksack aus Hanf Gelbe <span id="closse-text" onclick="layer_close_3(event);">Schließen</span></div>
<div id="bild-text"><img alt="" src="photo/113.jpg"></div>
<div id="text-pruduct">
<p>Verfügbarkeit: <b>eine Menge</b></p>
<p>Zustellung innerhalb von: <b>1-2 Tage</b></p>
</div>
</div>
</div>
</div>
Here you can view all Code, HTML, CSS, and JQuery related to this.
If anyone could provide guidance on resolving this issue, I would greatly appreciate it.