• There is NO official Otland's Discord server and NO official Otland's server list. The Otland's Staff does not manage any Discord server or server list. Moderators or administrator of any Discord server or server lists have NO connection to the Otland's Staff. Do not get scammed!

Layout Banner - Edit Text

noobwars

NoobWars.hopto.org Hoster
Joined
Apr 2, 2013
Messages
153
Reaction score
2
Hey!

Could any webdesigner be nice and help me with edit text for layout?

The text shall be "DecentOTS"

Code:
    width: 123px;
    height: 29px;
    padding-left: 40px;
    line-height: 29px;
    color: #fec700;
    font-family: tahoma, sans-serif;
    text-shadow: 0 2px 2px #000;
    font-size: 14px;
    background: url('img/title_bg.png') no-repeat;
    position: relative;

Layout Header:

F-Muw6kUc.png



Would be awsome if it got same text etc.. like this one

csMJosj_S.png
 
Last edited:
Maybe this will be helpful :)
Code:
http://www.entheosweb.com/tutorials/css/any_font.asp

Please note that src: url() the location of the font can be a directory or web address.

Example:
Code:
@font-face {
font-family: 'YourFontName'; /*a name to be used later*/
src: url('http://domain.com/fonts/font.ttf'); /*URL to font*/
}

or
Code:
@font-face {
font-family: 'YourFontName'; /*a name to be used later*/
src: url('fonts/font.ttf'); /* directory to font*/
}
 
@artofwork

i actually tried to do that myself, but i did not succedd xd.. i wonder if you can help me here is my layout.css

Code:
body
{
    background: url('img/bg.png') center top no-repeat #000;
    font-family: arial, sans-serif;
    font-size: 12px;
}
textarea,input
{
    max-width: 460px !important;
}
.news_title
{
    background: url('img/news_title.png') no-repeat;
    width: 480px;
    height: 25px;
    padding-left: 37px;
    padding-top: 20px;
    color: #7b2615;
    font-size: 14px;
    text-shadow: 0 1px 0 #000;
    position: relative;
}
.news_title .date
{
    right: 20px;
    top: 20px;
    color: #572a1d;
    font-size: 11px;
    position: absolute;
}
.news_mid
{
    background: url('img/news_mid.png') repeat-y;
    width: 477px;
    padding: 10px 20px;
    color: #8b3a1e;
    font-size: 12px;
    text-shadow: 0 1px 0 #000;
}
.news_bot
{
    background: url('img/news_bot.png') no-repeat;
    width: 517px;
    height: 12px;
}
.container
{
    width: 1027px;
    margin: 249px auto 0 auto;
}
.navbar_top
{
    background: url('img/navbar_top.png') no-repeat;
    width: 1027px;
    height: 39px;
}
.navbar_mid
{
    background: url('img/navbar_mid.png') no-repeat center;
    width: 1027px;
    height: 57px;
    position: relative;
}
.nav_search
{
    background: url('img/navbar_search.png') no-repeat;
    width: 134px;
    height: 32px;
    padding-left: 10px;
    position: absolute;
    top: 10px;
    right: 57px;
    border: 0 none;
    color: #5e160a;
}
.nav_search_btn
{
    background: url('img/navbar_search.png') no-repeat right;
    width: 32px;
    height: 32px;
    padding-left: 10px;
    position: absolute;
    top: 10px;
    right: 25px;
    border: 0 none;
}
.nav_search_btn:hover
{
    cursor: pointer;
}
.navbar_mid a
{
    background: url('img/navbar_links.png') no-repeat;
    display: block;
    height: 57px;
    float: left;
}
.navbar_mid a.link1
{
    background-position: 0 0;
    width: 84px;
}
.navbar_mid a.link1:hover{background-position: 0 -57px;}
.navbar_mid a.link2
{
    background-position: -84px 0;
    width: 121px;
}
.navbar_mid a.link2:hover{background-position: -84px -57px;}
.navbar_mid a.link3
{
    background-position: -205px 0;
    width: 66px;
}
.navbar_mid a.link3:hover{background-position: -205px -57px;}
.navbar_mid a.link4
{
    background-position: -271px 0;
    width: 80px;
}
.navbar_mid a.link4:hover{background-position: -271px -57px;}
.navbar_mid a.link5
{
    background-position: -351px 0;
    width: 143px;
}
.navbar_mid a.link5:hover{background-position: -351px -57px;}
.navbar_mid a.link6
{
    background-position: -494px 0;
    width: 118px;
}
.navbar_mid a.link6:hover{background-position: -494px -57px;}
.navbar_bot
{
    background: url('img/navbar_bot.png') no-repeat center;
    width: 1027px;
    height: 10px;
    position: absolute;
    bottom: -10px;
    z-index: 2;
}
.container_cnt
{
    width: 899px;
    margin: 3px auto 0 auto;
}
.widget_title
{
    width: 123px;
    height: 29px;
    padding-left: 40px;
    line-height: 29px;
    color: #fec700;
    font-family: tahoma, sans-serif;
    text-shadow: 0 2px 2px #000;
    font-size: 14px;
    background: url('img/title_bg.png') no-repeat;
    position: relative;
}
.widget_title img
{
        position: absolute;
        left: 1px;
        top: 1px;
}
.spacer_left
{
    width: 163px;
    height: 9px;
    background: url('img/left_spacer.png') no-repeat;
}
.spacer_right
{
    width: 163px;
    height: 9px;
    background: url('img/right_spacer.png') no-repeat;
}
.container_left
{
    width: 175px;
    float: left;
}
.container_left .top
{
    width: 175px;
    height: 12px;
    background: url('img/leftcnt_top.png') no-repeat;
}
.container_left .mid
{
    width: 163px;
    padding-left: 12px;
    background: url('img/leftcnt_mid.png') repeat-y;
}
.container_left .bot
{
    width: 175px;
    height: 12px;
    background: url('img/leftcnt_bot.png') no-repeat;
}
.container_left ul
{
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 11px;
}
.container_left ul li
{
    color: #8a4120;
    text-shadow: 0 1px 0 #000;
}
.container_left ul li a:before
{
    content: "\00BB  ";
}
.container_left ul li a
{
    color: #8a4120;
    text-shadow: 0 1px 0 #000;
    display: block;
    background: url('img/leftlink_bg.png') no-repeat;
    width: 147px;
    height: 25px;
    line-height: 25px;
    text-decoration: none;
    padding: 0 0 0 15px;
}
.container_left ul li a:hover
{
    color: #e79874;
    background: url('img/leftlink_bg_hover.png');
}
.container_right
{
    width: 175px;
    float: left;
}
.container_right .top
{
    width: 175px;
    height: 12px;
    background: url('img/rightcnt_top.png') no-repeat;
}
.container_right .mid
{
    width: 163px;
    padding-right: 12px;
    background: url('img/rightcnt_mid.png') repeat-y;
}
.container_right .bot
{
    width: 175px;
    height: 12px;
    background: url('img/rightcnt_bot.png') no-repeat;
}
.container_right ul
{
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 11px;
}
.container_right ul li
{
    color: #aa6d51;
    text-shadow: 0 1px 0 #000;
    display: block;
    background: url('img/rightlink_bg.png') no-repeat;
    width: 147px;
    height: 25px;
    line-height: 25px;
    text-decoration: none;
    padding: 0 0 0 15px;
    position: relative;
}
.container_right span
{
    color: #efe3de;

}
.container_right span.lvl
{
    text-shadow: 0 1px 0 #000;
    right: 5px;
    position: absolute;
}
.container_right a.playerlink
{
    position: absolute;
    color: #bf714e;
    text-decoration: none;
}
.container_right a:hover
{
    color: yellow;
}
.quicklogin
{
    background: url('img/quicklogin_bg.png') no-repeat;
    width: 163px;
    height: 96px;
}
input.loginfield
{
    background: url('img/loginfield.png') no-repeat;
    width: 140px;
    padding-left: 10px;
    line-height: 23px;
    font-size: 11px;
    color: #4f2716;
    text-shadow: 0 1px 0 #000;
    margin: 7px 0 0 7px;
    height: 23px;
    border: 0 none;
}
input.loginfield_pass
{
    background: url('img/loginfield.png') no-repeat;
    width: 140px;
    padding-left: 10px;
    line-height: 23px;
    font-size: 11px;
    color: #4f2716;
    text-shadow: 0 1px 0 #000;
    margin: 4px 0 0 7px;
    height: 23px;
    border: 0 none;
}
input.loginfield_submit
{
    background: url('img/loginbtn.png') no-repeat;
    width: 71px;
    padding-left: 10px;
    line-height: 23px;
    font-size: 11px;
    color: #bb6e4a;
    text-align: center;
    text-shadow: 0 1px 0 #000;
    margin: 4px 0 0 7px;
    height: 26px;
    float: left;
    border: 0 none;
}
input.loginfield_submit:hover
{
    cursor: pointer;
    color: #fff;
}
.loginfield_register
{
    width: 75px;
    height: 26px;
    line-height: 26px;
    color: #aa6d51;
    text-align: center;
    float: left;
    margin-top: 3px;
    font-size: 11px;
    text-shadow: 0 1px 0 #000;
}
.loginfield_register a
{
    text-decoration: none;
    color: #efe3de;
}
.loginfield_register a:hover
{
    color: yellow;
}
.container_mid
{
    width: 515px;
    padding: 7px 17px 0 17px;
    float: left;
    background: url('img/midcnt_bg.png') repeat-y;
    min-height: 750px;
    position: relative;
    color: #a78e6d;
}
.container_mid a
{
    color: #b93f16;
    text-decoration: none;
}
.container_mid a:hover
{
    text-decoration: underline;
}
.container_mid_foot
{
    width: 567px;
    height: 36px;
    z-index: 3;
    position: absolute;
    background: url('img/midcnt_bot.png') no-repeat;
    bottom:-28px;
    left: -8px;
}
.footer
{
    width: 100%;
    margin: 50px 0;
    text-align: center;
    float: left;
    color: #573417;
    font-size: 11px;
}
 
I would need a bit more information than the css file since I don't know the exact layout, what is the name of the AAC your using?

The reason for I ask is because each dot (.) followed by a label is a class that is associated with an element on the page layout, but if i don't know the layout I can't just automatically create a new class and expect it to work 100%.
 
Last edited:
Back
Top