Hi,

I'm designing a website for someone, at this stage we're just trying to get the layout and work out what tweaks are needed before going into production.

I've worked out how to use custom.css and managed to remove some padding and the line between main content and sidebar1.

But I am struggling to remove the padding between menu and banner without affecting the rest of the content.

I've tracked it down to zen-spotlight in template.mustang.css

.zen-spotlight {
padding: 20px 0;
}

.zen-spotlight {
border-bottom: 1px solid #fff;
padding: 30px 0 0;
}

I put this in custom.css but it then affects the footer.

Could you please point me in the right direction. I just want to have no spacing between the banner and menu.

If you want to look at the site to see what I'm talking about it is.

www.roofingworksservices.co.nz/testsite
.
I may have to more questions, but will try and figure it out for myself first.
But this problem has been driving me insane.

I'm running Joomla 3.4.1 and template version is either 1.2.1.
But I will upgrade, I had to roll back to 1.21 to isolate an issue.

Michael

I think I figured it out.

By doing this doesn't affect zen-spotlight itself but just the css id's navwrap and bannerwrap

#navwrap .zen-spotlight {
padding-top: 0px;
padding-bottom: 0px;
}

#bannerwrap .zen-spotlight {
padding-top: 0px;
padding-bottom: 0px;
}

So all sorted?

Cheers
Paul

Hi,

Yes all appears to be sorted.

There is another thing, i'm trying to track the code in firebug.

I am not using breadcrumbs so trying to remove the horizontal lines.
See attached screenshot.

Little bit awkward without having a custom css file to work with

#breadcrumbwrap .zen-spotlight, #bannerwrap .zen-spotlight, .mainwrap.zen-spotlight {border:0;}

Try adding this

How are you adding new css to the site by the way?

For overriding existing css I'm using custom.css. I haven't added any additional css styles yet. Just overrides.

Adding this to what I suggested earlier

#breadcrumbwrap .zen-spotlight, #bannerwrap .zen-spotlight, .mainwrap.zen-spotlight {border:0;}

#breadcrumbwrap .zen-spotlight, #bannerwrap .zen-spotlight, .mainwrap.zen-spotlight {border:0;}

#bannerwrap .zen-spotlight:after, #breadcrumbwrap .zen-spotlight:after {background:transparent;}