We hope you enjoy your visit.

You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.


Join our community!


If you're already a member please log in to your account to access all of our features:

Username:   Password:
Add Reply
Lush Greeen; First Skin
Topic Started: Jan 29 2006, 07:17 PM (582 Views)
.CrAzY lAdY
Member Avatar
Member
[ * ]
Name: Lush Green
Author: Chris/Me/Nadia
Skin Number: 1
Date Created: 29th January 2006
Side Notes: It's my first skin and I am quite happy with it. I make buttons to go with it.

Preview of the skin


CSS of skin:
Header
Quote:
 
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000"><body text="#000000" link="#000000" vlink="#000000" alink="#000000" leftmargin="2" topmargin="2" marginwidth="2" marginheight="0">
<table width="750" border="1" align="center" cellpadding="4" cellspacing="0" bgcolor="#HEX" bordercolor="#66CC00">
<tr>
  <td width="90%" bgcolor="#99CC66">
<CENTER>Skin created by <B>Chris</B>. Find more great skins at the <B><A HREF="http://forums.ifskinzone.net/index.php?act=idx" TARGET="_BLANK">IF Skin Zone</A></B>.</CENTER>
<% BOARD HEADER %>
<% NAVIGATION %>
<% BOARD %>
<% STATS %>


CSS
Quote:
 
html { overflow-x: hidden; overflow-y: auto; }

form { display:inline; }
img  { vertical-align:middle; border:1px }
BODY { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #336600; margin:0px 10px 0px 10px;background-color:#336600 }
TABLE, TR, TD { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #336600; }
a:link, a:visited, a:active { text-decoration: underline; color: #336600 }
a:hover { color: #66CC00; text-decoration:underline }

fieldset.search { padding:6px; line-height:150% }
label { cursor:pointer; }

img.attach { border:2px outset #336600;padding:2px }

.googleroot  { padding:6px; line-height:130% }
.googlechild { padding:6px; margin-left:30px; line-height:130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size:11px; color: #3A4F6C; }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#00D; }
.googlepagelinks { font-size:1.1em; letter-spacing:1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#434951 }

li.helprow { padding:0px; margin:0px 0px 10px 0px }
ul#help    { padding:0px 0px 0px 15px }

option.cat { font-weight:bold; }
option.sub { font-weight:bold;color:#555 }
.caldate  { text-align:right;font-weight:bold;font-size:11px;color:#336600;background-color:#669933;padding:4px;margin:0px }

.warngood { color:green }
.warnbad  { color:red }

#padandcenter { margin-left:auto;margin-right:auto;text-align:center;padding:14px 0px 14px 0px }

#profilename { font-size:28px; font-weight:bold; }
#calendarname { font-size:22px; font-weight:bold; }

#photowrap { padding:6px; }
#phototitle { font-size:24px; border-bottom:1px solid black }
#photoimg  { text-align:center; margin-top:15px }

#ucpmenu    { line-height:150%;width:22%; border:1px solid #336600;background-color: #99CC66 }
#ucpmenu p  { padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #99CC66; border:1px solid #336600;line-height:150%; width:auto }
#ucpcontent p  { padding:10px;margin:0px; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip { border:1px solid #336600;background-color: #3860BB;background-image:url(http://img16.imageshack.us/img16/4855/logostrip4ji.png);padding:0px;margin:0px; }
#submenu  { border:1px solid #336600;background-color: #669933;font-size:10px;margin:3px 0px 3px 0px;color:#336600;font-weight:bold;}
#submenu a:link, #submenu  a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #336600; }
#userlinks { border:1px solid #336600; background-color: #669933 }

#navstrip  { font-weight:bold;padding:6px 0px 6px 0px; }

.activeuserstrip { background-image: url(http://img11.imageshack.us/img11/3964/activeuserstrip6th.png); padding:6px }

.pformstrip { background-image: url(http://img35.imageshack.us/img35/9527/titlemedium3cq.png); color:#336600;font-weight:bold;padding:7px;margin-top:1px }
.pformleft  { background-color: #669933; padding:6px; margin-top:1px;width:25%; border-top:1px solid #336600; border-right:1px solid #336600; }
.pformleftw { background-color: #F5F9FD; padding:6px; margin-top:1px;width:40%; border-top:1px solid #336600; border-right:1px solid #336600; }
.pformright { background-color: #99CC66; padding:6px; margin-top:1px;border-top:1px solid #336600; }

.post1 { background-color: #99CC66 }
.post2 { background-color: #99CC66 }
.postlinksbar { background-color:#336600;padding:7px;margin-top:1px;font-size:10px; background-image: url(http://img35.imageshack.us/img35/9527/titlemedium3cq.png) }

.row1 { background-color: #B3E580 }
.row2 { background-color: #B3E580 }
.row3 { background-color: #99CC66 }
.row4 { background-color: #B3E580 }
div.row4 {
border-color: #336600!important;
background-color: #336600
}

.darkrow1 { background-color: #336600; color:#99CC66; }
.darkrow2 { background-color: #336600; color:#99CC66; }
.darkrow3 { background-color: #336600; color:#99CC66; }

.hlight { background-color: #B3E580 }
.dlight { background-color: #CCFF99 }

.titlemedium { font-weight:bold; color:#336600; padding:7px; margin:0px; background-image: url(http://img35.imageshack.us/img35/9527/titlemedium3cq.png) }
.titlemedium  a:link, .titlemedium  a:visited, .titlemedium  a:active  { text-decoration: underline; color: #336600 }

.maintitle { vertical-align:middle;font-weight:bold; color:#336600; letter-spacing:1px; padding:7px 0px 8px 5px; background-image: url(http://img25.imageshack.us/img25/4310/mt13aa.png) }
.maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; color: #336600 }
.maintitle a:hover { text-decoration: underline }

.plainborder { border:1px solid #336600;background-color:#336600 }
.tableborder { border:1px solid #336600;background-color:#336600; padding:0px; margin:0px; width:100% }
.tablefill  { border:1px solid #336600;background-color:#99CC66;padding:6px;  }
.tablepad    { background-color:#99CC66;padding:6px }
.tablebasic  { width:100%; padding:0px 0px 0px 0px; margin:0px; border:0px }

.wrapmini    { float:left;line-height:1.5em;width:25% }
.pagelinks  { float:left;line-height:1.2em;width:35% }

.desc { font-size:10px; color:#434951 }
.edit { font-size: 9px }

.signature  { font-size: 10px; color: #339 }
.postdetails { font-size: 10px }
.postcolor  { font-size: 12px; line-height: 160% }

.normalname { font-size: 12px; font-weight: bold; color: #003 }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12px }
.unreg { font-size: 11px; font-weight: bold; color: #900 }

.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }

#QUOTE { font-family: Verdana, Arial; font-size: 11px; color: #669933; background-color: #99CC66; border: 1px solid #336600; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
#CODE  { font-family: Courier, Courier New, Verdana, Arial;  font-size: 11px; color: #669933; background-color: #99CC66; border: 1px solid #336600; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }

.copyright { font-family: Verdana, Tahoma, Arial, Sans-Serif; font-size: 9px; line-height: 12px }

.codebuttons  { font-size: 10px; font-family: verdana, helvetica, sans-serif; vertical-align: middle }
.forminput, .textinput, .radiobutton, .checkbox  { font-size: 11px; font-family: verdana, helvetica, sans-serif; vertical-align: middle; color: #669933; background-color: #CCFF99; border: 1px #336600 solid;
} }

.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px;border-top:1px solid #336600;border-bottom:1px solid #336600 }

.purple { color:purple;font-weight:bold }
.red    { color:red;font-weight:bold }
.green  { color:green;font-weight:bold }
.blue  { color:blue;font-weight:bold }
.orange { color:#F90;font-weight:bold }
Offline Profile Quote Post Goto Top
 
karateboy310
Member
[ *  * ]
Like the skin style but hate the color green
Offline Profile Quote Post Goto Top
 
.CrAzY lAdY
Member Avatar
Member
[ * ]
Thanks. I will remember that for future skins I do.
Offline Profile Quote Post Goto Top
 
karateboy310
Member
[ *  * ]
Hey don't bank on the color choice. There is always going to be some critic of the color or something just pick colors you want. It's your skin don't let someone else pick everything for you
Offline Profile Quote Post Goto Top
 
Spammy Sammy
carpe diem
[ *  *  *  *  *  *  *  * ]
Gradients are kinda flat. Titlemedium and pformstrip's too tall, reduce the padding. Submenu and userlinks might look better with gradients too. Change the div.row4 bg color, it's the same color as the text.

Add this code to the CSS to reduce the Portal width:
Quote:
 
#ipbwrapper { text-align:left; width:790px; margin-left:auto; margin-right:auto }

Make the number in red more or less, depending on how wide you want the Portal.

Lighten up the darkrow1, maybe make it match the caldate.

Maybe try image borders. :)
Offline Profile Quote Post Goto Top
 
Master Sword
Member Avatar
Member
[ *  *  * ]
The links are the same color as the background. A few things like that. Other than that its pretty cool.:)
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Mixed · Next Topic »
Add Reply