The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Adding shadow/gradient

View previous topic View next topic Go down

Solved Adding shadow/gradient

Post by DeathDunk98* on Thu Apr 03, 2014 1:46 pm

I've seen this effect in many forums, I just wanned to make sure that I'll put this effect in my forum as well, so this is a picture of the effect:         As you can see theres a shadow in each line in both sides down-up shadow, so If someone knows how to make this I would be grateful Smile


Last edited by andiikadriu on Fri Apr 04, 2014 2:33 am; edited 1 time in total

DeathDunk98*
Forumember

Posts : 479
Reputation : 3
Language : Shqip

Back to top Go down

Solved Re: Adding shadow/gradient

Post by SLGray on Thu Apr 03, 2014 1:52 pm

Post your forum's link for appearance issues/questions.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36708
Reputation : 2446
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Adding shadow/gradient

Post by DeathDunk98* on Thu Apr 03, 2014 1:52 pm


DeathDunk98*
Forumember

Posts : 479
Reputation : 3
Language : Shqip

Back to top Go down

Solved Re: Adding shadow/gradient

Post by SLGray on Thu Apr 03, 2014 1:55 pm

So you want to remove the yellow hover and replace it with something else?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36708
Reputation : 2446
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Adding shadow/gradient

Post by DeathDunk98* on Thu Apr 03, 2014 1:57 pm

No the yellow hover it's fine, what  I want is not hovering, just the shadow to stay on the lines!

DeathDunk98*
Forumember

Posts : 479
Reputation : 3
Language : Shqip

Back to top Go down

Solved Re: Adding shadow/gradient

Post by Xan. on Thu Apr 03, 2014 5:47 pm

That's an image gradient.  You should make a small gradient image then put it in your css like this:

.forumline_catg tr{
background-image:url('your-image-url.jpg');
background-repeat:x;
}

Repeating it on the x-axis makes it only repeat horizontally, so you can use a smaller image which saves bandwidth and uploading time.

Xan.
New Member

Posts : 6
Reputation : 1
Language : English

http://hogwartslives.forumotion.com/

Back to top Go down

Solved Re: Adding shadow/gradient

Post by DeathDunk98* on Fri Apr 04, 2014 2:08 am

it's not working !

DeathDunk98*
Forumember

Posts : 479
Reputation : 3
Language : Shqip

Back to top Go down

Solved Re: Adding shadow/gradient

Post by Rhino.Freak on Fri Apr 04, 2014 2:19 am

Code:

.forumline_catg tr {
background: #b5b0b7; /* Old browsers */
background: -moz-linear-gradient(top,  #b5b0b7 2%, #fcfcfc 30%, #fcfcfc 70%, #b5b0b7 98%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#b5b0b7), color-stop(30%,#fcfcfc), color-stop(70%,#fcfcfc), color-stop(98%,#b5b0b7)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b5b0b7 2%,#fcfcfc 30%,#fcfcfc 70%,#b5b0b7 98%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b5b0b7 2%,#fcfcfc 30%,#fcfcfc 70%,#b5b0b7 98%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b5b0b7 2%,#fcfcfc 30%,#fcfcfc 70%,#b5b0b7 98%); /* IE10+ */
background: linear-gradient(to bottom,  #b5b0b7 2%,#fcfcfc 30%,#fcfcfc 70%,#b5b0b7 98%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5b0b7', endColorstr='#b5b0b7',GradientType=0 ); /* IE6-9 */
}

add in css

Rhino.Freak
Helper
Helper

Male Posts : 1246
Reputation : 105
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Adding shadow/gradient

Post by DeathDunk98* on Fri Apr 04, 2014 2:21 am

Im not getting anything special just the same view ? take a look : http://www.islamishendrit.halofight.com ? I have to put all that code in css right ?

DeathDunk98*
Forumember

Posts : 479
Reputation : 3
Language : Shqip

Back to top Go down

Solved Re: Adding shadow/gradient

Post by Rhino.Freak on Fri Apr 04, 2014 2:22 am

andiikadriu wrote:Im not getting anything special just the same view ? take a look : http://www.islamishendrit.halofight.com ? I have to put all that code in css right ?

remove this from your css
Code:
.forumline_catg tr {
background: #EEE;
}

Rhino.Freak
Helper
Helper

Male Posts : 1246
Reputation : 105
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Adding shadow/gradient

Post by DeathDunk98* on Fri Apr 04, 2014 2:26 am

Rhino.Freak thanks a lot Smile TOPIC SOLVED

DeathDunk98*
Forumember

Posts : 479
Reputation : 3
Language : Shqip

Back to top Go down

Solved Re: Adding shadow/gradient

Post by Jophy on Fri Apr 04, 2014 2:52 am

Solved

Jophy
ForumGuru

Male Posts : 17924
Reputation : 835
Language : English
Location : Somewhere

Back to top Go down

View previous topic View next topic Back to top


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