Breadcrumb 'header' is not 100% width.. please help.

I'm looking at Zen Cart, to possibly move my OSC website to it. In working with the CSS for coloring, etc., and with some of the sideboxes, I've suddenly got a layout problem.

The CENTER section header (where the breadcrumbs are) does NOT go 100% of the way across, but stops at the beginnings of the left and right column boxes.

Also, the first column box on each side is dropped DOWN about 1/2 the height of the center section.

Can anyone tell me what I've done, or where I can fix this? I'd like the breadcrumb 'header' to go all the way to both sides, ABOVE the sideboxes.

Thanks

Can anyone tell me what I've done, or where I can fix this? I'd like the breadcrumb 'header' to go all the way to both sides, ABOVE the sideboxes.

The page is designed so the breadcrumb fits between the side columns. To change it you will need to create a custom template override for the common/tpl_main_page.php. See the FAQs for instructions on creating your custom templates.

WOW!... really? I swear that when I first installed Zen Cart, that header went all the way across to the left margin, and also all the way to the right... maybe I just don't remember correctly. On my existing OSC website, that bar goes all the way across to the margins, above the column headers for the first boxes on each side.

BUT, I'm sure that it was at the same height at least... I definitely notice something different about it, as BOTH columns are dropped down about 1/2 the height of the header bar where the breadcrumbs are...

Can you tell me how to make them even?

Thanks!

The page layout changed between the 1.2 series and the 1.3 series. You can adjust the margins and/or padding for the sideboxes in your CSS.

OK. Sorry to be so dumb, but do I change the "navcolumnone", "navcolumnonewrapper", "navbreadcrumb" or something else?

Also, what does something like "padding: 0.5em 0.5em;" in the "navbreadcrumb" mean?

(sorry, I don't have a CSS reference here, and this is the first time I've done much with it)

Thanks again for your help.

Well, after much trial, I think I've got it, although something doesn't seem right... I changed several "margin", "margin-top" and "padding" entries, and it looks better now.

What I don't quite get, is that I had to set the following:

#navBreadCrumb {
padding: 0.6em;
background-color: #008080;
font-size: 0.95em;
font-weight: bold;
color: #ffffff;
margin: 1.6em 0.1em;
}

and then,

#navColumnOneWrapper, #navColumnTwoWrapper {
margin-left: 0.1em;
margin-right: 0.3em;
}

in order to get them to line up horizontally, with a slight gap between the headers... I'm sure there's something that is out of whack someplace else, but cannot find it. The "margin 1.6em" in the breadcrumb is bothering me, because it's NOT anywhere else.

The URL where your problem can be seen?

It's a dev copy on my local PC in my office... I don't have it published on my live site.

The only way would be to send an invite to view my PC via Gotomypc.