5 Panel Layout and CSS padding..

A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.

This thread is closed to new posts. You must sign in to post in the forums.
5/1/2013 5:49:36 PM
castlesoft
Gravatar
Total Posts 101
View Posts

5 Panel Layout and CSS padding..

Hi,

Is there a cleaner way of doing this ?

I have 2 extra panels ( Top and Bottom ) as per docs.

The new panels are full screen width, the normal Left/Centre/Right are a sheet in the centre of the page.

All works well, except the extra TopPanel has a 5px margin.

After some digging its due to the .modulecontent { padding: 5px; } in the style.css file.

I can stop it for the toppanel by doing the following:

.modulecontent:not(#ctl00_altContent1_ctl00_pnlInnerBody) {
    padding: 5px;
}

But its not very pretty.

Is there a better way to stop the top panel from applying the modulecontent style/padding ?

Thanks

Andrew


 

5/1/2013 5:58:08 PM
Isaac Hall
Gravatar
Total Posts 216
View Posts
Community Expert

mojoPortal Hosting & Design @ i7MEDIA!

Re: 5 Panel Layout and CSS padding..

In your layout.master, find the <portal:LayoutPanel /> that is your Top Pane. Add SkinID="TopPane" to the portal, if it's not already there.

Next, in your theme.skin, add something like this:
<portal:LayoutPanel runat="server" SkinID="TopPane"
    Element="div"
    ExtraCssClasses="yourtoppaneclass"
    />

Next, in your CSS, add something like this:

.yourtoppaneclass .modulecontent { padding: 0; }

Hope this helps,
-Isaac

5/1/2013 6:09:04 PM
castlesoft
Gravatar
Total Posts 101
View Posts

Re: 5 Panel Layout and CSS padding..

Perfect.. Thankyou very much.

Greatly Appreciated.

Works 100%.

You must sign in to post in the forums. This thread is closed to new posts.