ok Guys I got a Template working yesterday after hours of working with it and begging the HTML Goddess (Diana P.) for help, eventualy I got it and then worked to make it more pleasing to the eyes... now I have a Template I am working on that has a background image ... there is only 1 issue... all the {{key}} and {{value}} are on the left side, considering that the template I worked on yesterday was done I researched and checked it with the new in HTML, now I am sure the problem is in CSS because the coding for HTML is simple and not complicated, just KEY and Value.. basicly... oh and Header but that is a no duh.. so here it is guys the CSS to the Template i am trying to create, once it is done I will post the finished product into the show your macros here thread, but untill then PLEASE HELP? here is the CSS }
.sheet-rolltemplate-Test table {
width: 100%;
padding: 2px;
border: 1px solid;
background-color: transparent;
background: url(<a href="http://i102.photobucket.com/albums/m89/linx2012/screaming_skull_light_zpsyhcddgt2.jpg" rel="nofollow">http://i102.photobucket.com/albums/m89/linx2012/screaming_skull_light_zpsyhcddgt2.jpg</a>);
background-size: 200px 280px;
background-repeat: no-repeat;
text-align: left;
}
.sheet-rolltemplate-Test th {
/*color: rgb(184, 0, 0);*/
padding-left: 5px;
line-height: 1.6em;
font-size: 1.2em;
text-align: center;
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
}
.sheet-rolltemplate-Test1 .sheet-header{
background-color: #708090;
color: black;
text-align: center;
/*color: rgba(112,32,130,1);*/
}
.sheet-rolltemplate-Test .sheet-header-attack {
color: rgb(126, 45, 64);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-initiative {
color: rgb(204, 153, 51);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-spell{
color: rgb(45, 64, 126);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-ability {
color: rgb(204, 115, 51);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-save {
color: rgb(153, 77, 153);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-skill {
color: rgb(64, 126, 45);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-skillcat{
color: rgb(45, 126, 107);
font-family: "Arial", Helvetica, sans-serif;
font-variant: small-caps;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-header-basic{
background-color: gray;
color: white;
text-align: center;
/*color: rgba(112,32,130,1);*/
}
.sheet-rolltemplate-Test .sheet-subheader {
color: #B22222;
font-size: 1em;
font-style: italic;
text-align: left;
}
.sheet-rolltemplate-Test .sheet-arrow-right {
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
border-left: 180px solid rgb(126, 45, 64);
}
.sheet-rolltemplate-Test .sheet-arrow-left {
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
border-right: 180px solid rgb(126, 45, 64);
}
.sheet-rolltemplate-Test .sheet-arrow-spell {
border-top: 3px solid rgb(45, 64, 126);
border-bottom: 3px solid rgb(45, 64, 126);
border-left: 90px solid transparent;
border-right: 90px solid transparent;
}
.sheet-rolltemplate-Test .sheet-arrow-ability {
border-top: 3px solid transparent;
border-bottom: 3px solid rgb(204, 115, 51);
border-left: 90px solid rgb(204, 115, 51);
border-right: 90px solid rgb(204, 115, 51);
}
.sheet-rolltemplate-Test .sheet-arrow-save {
border-top: 3px solid rgb(153, 77, 153);
border-bottom: 3px solid rgb(153, 77, 153);
border-left: 90px solid rgb(153, 77, 153);
border-right: 90px solid rgb(153, 77, 153);
}
.sheet-rolltemplate-Test .sheet-arrow-skill {
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
border-left: 90px solid rgb(64, 126, 45);
border-right: 90px solid rgb(64, 126, 45);
}
.sheet-rolltemplate-Test .sheet-arrow-skillcat {
border-top: 3px solid transparent;
border-bottom: 3px solid rgb(45, 126, 107);
border-left: 90px solid transparent;
border-right: 90px solid transparent;
}
.sheet-rolltemplate-Test .sheet-arrow-initiative {
border-top: 1px solid rgb(204, 153, 51);
border-bottom: 1px solid rgb(204, 153, 51);
border-left: 90px solid rgb(204, 153, 51);
border-right: 90px solid rgb(204, 153, 51);
}
.sheet-rolltemplate-Test .sheet-solid-full {
border-top: 3px solid rgb(126, 45, 64);
border-bottom: 3px solid rgb(126, 45, 64);
border-left: 180px solid rgb(126, 45, 64);
border-right: 0px solid rgb(126, 45, 64);
}
.sheet-rolltemplate-Test .sheet-tcat {
font-style: italic;
}
.sheet-rolltemplate-Test .sheet-dcolor {
color: rgb(193, 80, 107);
}
.sheet-rolltemplate-Test td {
padding-left: 5px;
}
.sheet-rolltemplate-Test .sheet-tr-repeating:nth-child(even){
background-color:#eee;
} And here is the image of what is it coming to be.
