Dirty Butter Posted June 13, 2015 Share Posted June 13, 2015 (edited) The top right hand corner of the Basket has what looks like a smear. Our other store also has a mark at the same place, although shaped differently. Any ideas where to look for whatever it is? Edited June 13, 2015 by Dirty Butter Quote Link to comment Share on other sites More sharing options...
bsmither Posted June 13, 2015 Share Posted June 13, 2015 This is the "mini-basket-arrow" as defined in cubecart.css line 130. It sort of looks like it could be an image (maybe loaded by javascript), but on a stock screen, it shows just the tip of a pyramid which has the apex sitting nicely directly underneath the price of the "basket-summary" (shopping cart and sub-total).But, because your skin has extra stuff in the header, the "basket-detail-container" still being 27px from the top edge of the viewport, I conclude that something has caused the apex of the pyramid to not show, but rather the base.This extra stuff in the header is exacerbated by the content-slider below the header. The css for this (line 192) has a rule for any class ending in "-arrow". Recall above the "mini-basket-arrow". The content slider CSS has damaged the "mini-basket-arrow" CSS.What you can do is to have the browser load the content slider CSS before the cubecart.css file. This then gives cubecart.css priority because it got loaded later.In the template where you added the content slider, find:<link type="text/css" href="{$STORE_URL}/content-slider/css/content-slider.css" rel="stylesheet">and MOVE it into the <head> section just after:<link rel="stylesheet" href="{$STORE_URL}/skins/blue/css/normalize.css">This should fix much of it, and we can add more properties to "mini-basket-arrow" to clean up anything left over. Quote Link to comment Share on other sites More sharing options...
Dirty Butter Posted June 13, 2015 Author Share Posted June 13, 2015 (edited) Moving the stylesheet link did not do anything. I stand corrected - moving the stylesheet did work, but that css had never been changed to use the white background.Commenting out the <div class="mini-basket-arrow"></div> took care of it. And what I thought was a similar problem on the store without the slider is that tiny pyramid tip.I ended up adding background-color: #FFFFFF; (there was none) to the mini-basket-arrow styling in cubecart.css, and kept the stylesheet move.Thanks! Edited June 13, 2015 by Dirty Butter Quote Link to comment Share on other sites More sharing options...
Dirty Butter Posted June 13, 2015 Author Share Posted June 13, 2015 This worked better in cubecart.css:.mini-basket-arrow { width: 0; height: 0; border-left: 5px solid #FFFFFF; transparent; border-right: 5px solid #FFFFFF; transparent; border-bottom: 5px solid #000; margin-left: 229px; } But the PBCKEDITOR used on this forum threw error messages on the border left and right lines. Not sure if they are correct or not. Quote Link to comment Share on other sites More sharing options...
bsmither Posted June 13, 2015 Share Posted June 13, 2015 No, probably not as seen above.transparent is a value for the background-color property. Quote Link to comment Share on other sites More sharing options...
Dirty Butter Posted June 13, 2015 Author Share Posted June 13, 2015 Back to the drawing board LOL. But not tonight... Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.