Global Minibasket

[andrewbond]

I am trying to align the <mvt:item name="global_minibasket" /> to the right of the login/register links in my header. No matter what I do, it seems to drop down the the line below. Here is the link to the site. Thanks..

http://dyerpackaging.com.mymiva.com/...vc?Screen=SFNT

[Matt Zimmermann]

The Base ReadyTheme is based on an older flavor of Bootstrap. The mini-basket is show appears in a light-box/modal view. Unfortunately, there is no easy way to control how the modal appears. You may try overwriting the code modal CSS in your theme file, but that could get a bit messy.

[andrewbond]

Its not the pop up box I want to align, Just the cart icon/basket count/icon-caret-down. Is that so difficult?

[Matt Zimmermann]

The display of that element is controlled through the visibility classes in Bootstrap which is utilizing !important. To override this, you will need to add something like this to your styles.css file:

.basket-count.hidden-xs {
    display: inline-block !important;
}

[Scot - ScotsScripts.com]

That's interesting, something is really forcing it to the next line but I can't see what it is in the inspector. Since you're using boostrap you can force the cart icon into that line by using bootstrap css for rows and columns. Try this.

Move the H2 tag to just above the search form tag and then do this to the other stuff:

<div class="row">
<div class="col-md-6">
<a href="http://dyerpackaging.com.mymiva.com/mm5/merchant.mvc?Screen=LOGN">Register</a> / <a href="#login" role="button" data-toggle="modal">Log In</a>
</div>
<div class="col-md-6">
<a href="#cart" role="button" data-toggle="modal" class="basket-count hidden-xs"><i class="icon-shopping-cart"></i> <span class="hidden-xs hidden-sm">44</span> <i class="icon-caret-down"></i></a>
<!-- XS a tags -->
<a href="#cart" role="button" data-toggle="modal" class="hidden-lg hidden-md hidden-sm xs-cart"><i class="icon-shopping-cart"><span>44</span></i></a>
</div>
</div>

The whole block would look like this:

<div class="hlinks col-md-3 col-sm-4 hidden-xs">
<div class="row">
<div class="col-md-6">
<a href="http://dyerpackaging.com.mymiva.com/mm5/merchant.mvc?Screen=LOGN">Register</a> / <a href="#login" role="button" data-toggle="modal">Log In</a>
</div>
<div class="col-md-6">
<a href="#cart" role="button" data-toggle="modal" class="basket-count hidden-xs"><i class="icon-shopping-cart"></i> <span class="hidden-xs hidden-sm">44</span> <i class="icon-caret-down"></i></a>
<!-- XS a tags -->
<a href="#cart" role="button" data-toggle="modal" class="hidden-lg hidden-md hidden-sm xs-cart"><i class="icon-shopping-cart"><span>44</span></i></a>
</div>
</div>
<h2 class="headers">1-888-ZIP-BAGS</h2>
<form method="post" action="//dyerpackaging.com.mymiva.com/mm5/merchant.mvc?Screen=SRCH" class="form-inline clearfix center-block" role="form">
<div class="form-group col-xs-10">
<input type="text" name="Search" value="" id="search" class="form-control" placeholder="Search Products">
</div>
<button type="submit" class="btn btn-default"><i class="icon-search"></i></button>
</form>
</div>