css - Vertical positioning for button in responsive design doesnt move -
css - Vertical positioning for button in responsive design doesnt move -
i having lot of problem getting button in bigcommerce theme vertically align bottom. since responsive design, absolute positioning doesn't quite work done. unfortunately thing seems move buttons @ all; i've tried sorts of methods relative positions , vertical position not budge. seems products listed within list functions table.
here css button itself. added stuff below "border" , have tried many different ways tried changing display inline-block.
.product-grid .productactionadd .button { display:block; background: #424546; border: 1px solid #303334; position: relative; vertical-alignment:bottom; bottom:0; }
i can provide css other parts well. below i'm trying fix. 1-line product names have "in stock" button moved up.
image of buttons , problem
without total html/css or jsfiddle it's going hard me provide finish html/css solution, here's prepare problem:
wrap button , description within of element , setposition:relative
on wrapper element give buttons next style: position: absolute; margin: 0 auto; left: 0; right: 0; bottom: 5px;
set description fixed height , give wrappers fixed height that should solve issue. here's example
css responsive-design vertical-alignment
Comments
Post a Comment