The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Nav bar not displaying fully
rosanne5454
post Jun 25 2012, 10:03 AM
Post #1





Group: Members
Posts: 9
Joined: 25-June 12
Member No.: 17,326



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: Spirit, The Musical Merchandise

Any help would be very much appreciated.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rosanne5454
post Jun 25 2012, 10:05 AM
Post #2





Group: Members
Posts: 9
Joined: 25-June 12
Member No.: 17,326



http://360webmedia.com/Store/development/index.html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 25 2012, 11:48 AM
Post #3


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 15,195
Joined: 9-August 06
Member No.: 6



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.


--------------------
"Never go to excess, but let moderation be your guide."
- Cicero

IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rosanne5454
post Jun 25 2012, 12:31 PM
Post #4





Group: Members
Posts: 9
Joined: 25-June 12
Member No.: 17,326



QUOTE(pandy @ Jun 25 2012, 12:48 PM) *

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.





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;
}
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 24th July 2014 - 11:56 AM