Printable Version of Topic

Posted by: rosanne5454 Jun 25 2012, 10:03 AM

I have designed a page from a CSS Hub template and the Nav Bar was displaying
okay until I added coding from a JQUERY PAYPAL template I purchased in order to
set up a Store on this page. Ever since I pasted the Favicon coding to the head and
the additional coding to body, my Nav bar is no longer fully visible...I am missing the Contact
button & you can see the buttons are not lining up with the grey background image.

Here is my page: http://360webmedia.com/Store/development/index.html

Any help would be very much appreciated.

Posted by: rosanne5454 Jun 25 2012, 10:05 AM

http://360webmedia.com/Store/development/index.html

Posted by: pandy Jun 25 2012, 11:48 AM

The row of floated buttons wrap because there isn't room for all of them and the contact button is on the row below, but it's hidden by that black-maroon thing.

div#right is 630px. Looks like that's too narrow to accommodate the 5 buttons. If I make it wider the contact button turns up.

Posted by: rosanne5454 Jun 25 2012, 12:31 PM

Thanks very much for your suggestion.

I have changed the width (from 630 to 750) and it does help some but the nav bar still looks funny: I have a bg image : menu_right that is not appearing on the right that closes off the nav bar.

Also, there is something that is pushing my nav bar down so that it doesn't line up with the menu_bg.jpg. Not sure why this is happening? Could it be something from the custom.css that
came with the template? I have pasted it below...(not sure if it could be the JQUERY coding that is causing the problem?) Thanks for any help.


/* Globals */
body{
overflow:auto;
padding-top: 120px;
padding-bottom: 20px;
}

.modal-body{
max-height:300px;
overflow:auto;
max-width:100%;
}

.fl{
float:left;
}

.fr{
float:right;
}

.clear{
clear:both;
}

.tar{
text-align:right;
}

/* item specifics */

/* product details modal footer height */
.product_details_modal .modal-footer{
height:50px;
}
/* cart holder modal footer height */
#cart_holder .modal-footer{
height:80px;
}
/* show cart button top margin */
#showCart{
margin-top:40px;
}

/* Categories breadcrumb color */
#products_breadcrumb{

}
/* Current Category */
.active_category{
margin-left:1px;
}
/* Current Category link */
.active_category a{
background:#fff;
color:#FAA732;
}
#current_products_count{
margin-top:8px;
}
/* Price amount color */
.price_color{
color:#c80000;
}

/* Shopping Cart loader position*/
#shopping_cart_loader{
margin:100px auto; height:50px; width:200px; vertical-align:middle;
}

/* Product Item shadow */
.thumbnail{
border:0;
-webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.075);
-moz-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.075);
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.075);
}

/* Paypal button image */
.btn_img, .btn_img:hover,.btn_img.disabled{
padding:0;
margin-bottom:0;
background:transparent;
border:0;
}

/* Thumbnail image holder */
.thumb_holder{
margin:0 auto;
height:100px;
width:150px;
overflow:hidden;
background:url(../img/ajax-loader.gif) center center no-repeat;
}

/* Product summery */
.product_sum{
min-height:70px;
}

/* sidebar navigation */
.sidebar-nav {
padding: 9px 0;
}

/* Footer */
#footer{
background:#ddd; position:fixed; bottom:0; margin-bottom:-10px; height:20px; padding:6px 8px 10px 8px;
}