The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Image Background to the navbar

4 posters

Go down

Image Background to the navbar Empty Image Background to the navbar

Post by IdaTR July 17th 2013, 10:47 am

Hey! how do I make an Image background, to the navbar?

www.nionevrien.forumq.net

Want it to be as in www.vie-la-mort.forum-motion.com
IdaTR
IdaTR
Forumember

Female Posts : 547
Reputation : 1
Language : Danish, english
Location : Denmark

http://www.vielamort.net

Back to top Go down

Image Background to the navbar Empty Re: Image Background to the navbar

Post by levy July 17th 2013, 10:51 am

This is easy , I gonna show you a simple example

Code:
#page-header .navbar{
background-image: url(http://iceimg.com/i/b3/96/f7226d4f58.png);
}

replace this : http://iceimg.com/i/b3/96/f7226d4f58.png with your own image and it is done Smile
levy
levy
Hyperactive

Male Posts : 2632
Reputation : 350
Language : English, Romanian
Location : Romania

https://portofolio.goodforum.net/

Back to top Go down

Image Background to the navbar Empty Re: Image Background to the navbar

Post by IdaTR July 17th 2013, 10:57 am

THANKS SOLVED Very Happy
IdaTR
IdaTR
Forumember

Female Posts : 547
Reputation : 1
Language : Danish, english
Location : Denmark

http://www.vielamort.net

Back to top Go down

Image Background to the navbar Empty Re: Image Background to the navbar

Post by candy_fear_not_in_staff July 17th 2013, 10:58 am

IdaTR wrote:THANKS SOLVED Very Happy
Glad I could help. Razz
avatar
candy_fear_not_in_staff
Forumember

Posts : 25
Reputation : 1
Language : candy_fear_banned

Back to top Go down

Image Background to the navbar Empty Re: Image Background to the navbar

Post by Paradise July 19th 2013, 11:42 pm

candy_fear wrote:This is easy , I gonna show you a simple example

Code:
#page-header .navbar{
background-image: url(http://iceimg.com/i/b3/96/f7226d4f58.png);
}

replace this : http://iceimg.com/i/b3/96/f7226d4f58.png with your own image and it is done Smile


Candy I have tried out this code but not work. I wanted to use the code below not nothing happened so can you help me


Code:
#page-header .navbar {
    background: url("http://i43.servimg.com/u/f43/14/63/83/43/cat_to10.png") repeat-x scroll left top transparent;
    height: 40px;
    left: -8px;
    padding: 0;
    position: relative;
    width: 1016px;
}
#page-header .navbar .linklist {
    border: medium none;
}
#page-header .navbar .linklist > li > a {
    border: 1px solid rgba(0, 0, 0, 0.35);
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
    color: #FFFFFF;
    display: block;
    float: left;
    font-family: Tahoma,Geneva,Sans-Serif;
    font-size: 15px;
    font-weight: normal;
    height: 31px;
    margin: 0 3px;
    padding: 2px 10px 0;
    position: relative;
    text-shadow: 1px 1px 1px #2B6591 !important;
    border-top: 1px solid #2b6591;
    line-height: 30px;
    text-transform: uppercase;
}

#search-box {
    display: none;
}

#page-header .navbar .linklist > li > a:hover {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.18);
    color: #FFFFFF;
    border-top: 1px solid #2b6591;
}
#page-header .navbar .linklist > li > a img {
    display: none;
}
#page-header .navbar .corners-top {
    background: url("http://i42.servimg.com/u/f42/14/52/65/41/r_crn_10.png") no-repeat scroll 0 0 transparent;
    bottom: -7px;
    height: 47px;
    left: 3px;
    position: absolute;
    width: 7px;
}
#page-header .navbar .corners-bottom {
    background: url("http://i52.tinypic.com/17ppch.png") no-repeat transparent;
    bottom: -7px;
    height: 47px;
    position: absolute;
    right: 3px;
    width: 7px;
}


my forum http://www.favouriteforum.com
Paradise
Paradise
Forumember

Male Posts : 117
Reputation : 1
Language : English

http://igboist.forumotion.com/forum

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum