Page layout using CSS

...

Everyone has rights to view default.css. But if you really can't access it ... this is it...

/* start body style definition */
body {
font-family: verdana, arial, sans-serif;
font-size: x-small;
color: #000;
background-color: #999999;
}
/* end body style definition */

/*start body link styles definition*/
body a:link {
font-family: verdana, arial, sans-serif;
font-size: x-small;
background-color: #FFFFFF;
color: #CC0000;
text-decoration: none;
}
body a:visited {
font-family: verdana, arial, sans-serif;
font-size: x-small;
background-color: #FFFFFF;
color: #CC0000;
text-decoration: none;
}
body a:hover {
font-family: verdana, arial, sans-serif;
font-size: x-small;
background-color: #FFFFFF;
color: #FF0000;
text-decoration: none;
}
body a:active {
font-family: verdana, arial, sans-serif;
font-size: x-small;
background-color: #FFFFFF;
color: #FF0000;
text-decoration: none;
}
/*end body link styles definition*/


/*
The definitions below determine how the page looks.

There are 3 main div-elements, which are all positioned absolute
(relative to the upper left corner of the screen):

.contents: contains the main contents of the page.
.menu: sidebar with menu
.logo: logo to be displayed above the sidebar

*/

/*start body definition*/
.contents {
float:left;
width:80%;
background:#fff;
border-right:2px solid #000;
border-bottom:2px solid #000;
margin-right:15px;
padding-bottom:20px;
}
/*end body definition*/


/*start menu definition*/
.menu {
top: 90px;
left: 30px;
width: 120px;
margin-left:0px;

/* use a lighter text color (grey) and a smaller font */
color: #777;
font-size: x-small;
background-color: #999999;
}
/*end menu definition*/

/*start menu link styles definition*/
.menu a:link {
font-family: verdana, arial, sans-serif;
font-size: x-small;
color: #CC0000;
text-decoration: none;
font-weight: bold;
background-color: #999999;

}
.menu a:visited {
font-family: verdana, arial, sans-serif;
font-size: x-small;
color: #CC0000;
text-decoration: none;
font-weight: bold;
background-color: #999999;
}
.menu a:hover {
font-family: verdana, arial, sans-serif;
font-size: x-small;
color: #FF0000;
text-decoration: none;
background-color: #999999;
}
.menu a:active {
font-family: verdana, arial, sans-serif;
font-size: x-small;
color: #FF0000;
text-decoration: none;
background-color: #999999;
}
/*end menu link styles definition*/


/*
Definitions for headers in the menu (.menu h2), page titles (h1)
and dateheads (.contents h2):
- page titles are centered (within the .contents div)
- menu headers (h2) use a small font
- dateheads use a large font and are in a box
*/

h1 {
text-align: center;
}

.menu h2 {
font-size: small;
}

.contents h2 {
background-color: whitesmoke;
border: 1px solid #ccc;

padding: 5px;

font-size: large;

margin-bottom: 5px;
}

/*
Definitions for the item listings like they are done on the main page and in archives
- h3.item is the title of an item (<h3 class="item">)
- .itembody is the item contents
- .iteminfo contains the time of posting and the name of the author, and the amount of comments

anchors in the iteminfo (.iteminfo a) are not underlined and bold
*/

/* item title */
h3.item {
font-size: medium;
margin: 0px;
margin-top: 10px;
}

.itembody {
margin-top: 5px;
margin-bottom: 5px;
}

.iteminfo {
font-size: x-small;
color: gray;
}

.iteminfo a {
font-weight: bolder;
color: #555;
text-decoration: none;
}

/*
Definitions of how comments listings look like on item pages
- h3.comment contains the name of the comment author
- .commentbody contains the text from the comment
- .commentinfo contains the time of commenting
*/

/* comment title */
h3.comment {
font-size: medium;
margin-bottom: 10px;
}

.commentbody {
align: justify;
}

.commentinfo {
font-size: x-small;
color: gray;
}


/*
Some rules that apply to contents generated using the markup buttons
"add left box" and "add right box"

both boxes have slightly larger text, and take a maximum of 20% of
the width of the contents.
*/

.leftbox, .rightbox {
margin: 3px;
padding: 3px;
font-size: larger;
width: 20%;
}
.leftbox {
float: left;
border-right: 2px solid #ccc;
}
.rightbox {
float: right;
border-left: 2px solid #ccc;
}


/*
Some general rules:
- images never have a border (even when they are inside a hyperlink)
- elements having class="skip" are not shown
- item lists using <ul class="nobullets"> have no list-item bullets
- highlighted text (in search results) have a yellow background
*/

img {
border: none;
}

.skip {
display: none;
background-color: #FFFFFF;
}

ul.nobullets {
list-style: none;
margin-left: 0px;
padding-left: 0px;
}

.highlight {
background-color: yellow;
}





Originally posted by Benny
"You do not have access to this document" :huh:
 
One thing, CSS stylesheets do not get cached, html pages however do, try to keep it as much HTML as possible. This is for people on dialup.
 

Members online

No members online now.

Latest profile posts

Also Hi EP and people. I found this place again while looking through a oooollllllldddd backup. I have filled over 10TB and was looking at my collection of antiques. Any bids on the 500Mhz Win 95 fix?
Any of the SP crew still out there?
Xie wrote on Electronic Punk's profile.
Impressed you have kept this alive this long EP! So many sites have come and gone. :(

Just did some crude math and I apparently joined almost 18yrs ago, how is that possible???
hello peeps... is been some time since i last came here.
Electronic Punk wrote on Sazar's profile.
Rest in peace my friend, been trying to find you and finally did in the worst way imaginable.

Forum statistics

Threads
62,015
Messages
673,494
Members
5,623
Latest member
AndersonLo
Back