ProfileSkins03: Special Section Names

[Mimi58]

In this discussion, I'll be adding screenshots to show what areas on the profile page each "special name" affects. I put code for a red border and a yellow background. Ignore the border around the headshot. That is part of the image.

I'll put two in this post and then add one or two at a time to replies. Hope this helps you design your own "skins" for TBD! Let's get started.

The first is the header id:   #xg_head

The code I used was:

#xg_head {
background-color: #ffffcc;
border: 10px solid red;
}

==============

==============

The second is the class that affects most of the "boxes" in the main section: .xg_module

The code I used was:
.xg_module {
background-color: #ffffcc;
border: 10px solid red;
}

==============

 

[Aggie]

Thank you.

[Mimi58]

The "little boxes" on the profile page have both a head section - .xg_module_head - and a body - .xg_module_body I've used code to show a green dotted border around the head section and a purple border around the body section. Here's the code for the borders:

.xg_module_head {border: 10px dotted green}
.xg_module_body {border: 10px solid purple}

=============

=============

On my page, I have code so that both the module body and the module head are transparent with no bottom border: I leave it like this so because I use a translucent background for the main section so that whatever background I use will peep through.

.xg_module_body, .xg_module_head {
margin-bottom:0;
background-color: transparent;
}

[Mimi58]

I have added a red border and yellow background to the menu (navigation):

#xg_navigation

Code:

#xg_navigation {background-color: #ffffcc; border: 10px red solid;}

[Mimi58]

I have added a red border and yellow background to the big box in that holds most of the content of the page.

#xg_body

Code:

#xg_body {background-color: #ffffcc; border: 10px red solid;}