Basic mini cart!
Posted: Wed Feb 19, 2014 1:49 am
Hey all, I'm currently trying to slim the mini cart (placed within the header.tpl as <?php echo $cart; ?>).
I wanted just a simple header saying cart, showing the quantity of basket and total. However, the cart style isn't going all so well.
Basically, as you can see. The cart isn't within the container's above (the blue). Here is my css and tpl code's -
Stylesheet of cart
Cart.tpl code -
and lastly, the header.tpl (only where shopping cart is placed) -
I really am not sure why the cart isn't within the containers called topbarcontainer.
Just to add, I have placed some </br> to show that the shopping is attached to the bottom of the container.
I wanted just a simple header saying cart, showing the quantity of basket and total. However, the cart style isn't going all so well.
oc.jpg (85.11 KiB) Viewed 360 times
Stylesheet of cart
Code: Select all
#topbarcontainer #cart {
position: relative;
top: 0px;
right: 0px;
z-index: 9;
}
#topbarcontainer #cart .heading {
float: right;
margin-top: 0px;
padding-left: 14px;
padding-right: 14px;
border-top: 1px solid #FFFFFF;
border-left: 1px solid #FFFFFF;
border-right: 1px solid #EEEEEE;
background: #FFF;
z-index: 9999;
}
#topbarcontainer #cart .heading h4 {
color: #333333;
font-size: 20px;
font-weight: bold;
margin-top: 0px;
margin-bottom: 3px;
}
#topbarcontainer #cart .heading a {
color: #38B0E3;
text-decoration: none;
}
Code: Select all
<div id="cart">
<div class="heading">
<h4><?php echo $heading_title; ?></h4>
<a href="<?php echo $cart; ?>"><span id="cart-total"><?php echo $text_items; ?></span></a></div>
</div>
</div>
Code: Select all
<body>
<div id="topbarwrapper">
<div id="topbarcontainer">
hello
</br>
</br>
</br>
</br>
<?php echo $cart; ?>
</div>
</div>
<div id="container">
<div id="header">
....
Just to add, I have placed some </br> to show that the shopping is attached to the bottom of the container.