Jump to content


Photo
- - - - -

Carousel

Carousel

  • Please log in to reply
9 replies to this topic

#1 martinjrob

martinjrob

    Advanced Member

  • Members

  • 38 posts
  • LocationLancashire
  • Country: Country Flag

Posted 27 March 2013 - 04:52 PM

Hi I am having an issue with the Carousel colour which Catrina has tried to help me with but with no joy.

the carousel for some reason has decided to display a pink colour and i want it to be grey or just white, we have tried to change some of the css but still with no joy.

here is whet we have tried.

 


#page .section-carousel .content ul li a img, #page .section-carousel .content ul li a:hover img {box-shadow: 0 1px 4px #CCCCCC !important;}

 

#page .section-carousel .content ul li a img, #page .section-carousel .content ul li a:hover img {box-shadow: 0px !important;}

 

#page .section-carousel ul li a img {box-shadow: 0px !important;}

 

#page .section-carousel ul li a img {box-shadow: none !important;}

 

i dont really understand css, can anyone help me?

 

here is the website

 

Please Login or Register to see this Hidden Content

 

many thanks.



#2 batman

batman

    Bat Learning

  • Members

  • 2115 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 27 March 2013 - 07:50 PM

Hi martinjrob

You can try with

 

 

Please Login or Register to see this Hidden Content

 



#3 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 27 March 2013 - 11:05 PM

Thank you Batman :-) Let us know if that solution works for you Martin



#4 batman

batman

    Bat Learning

  • Members

  • 2115 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 28 March 2013 - 01:07 AM

Thank you for letting me answer James B...

:) 



#5 martinjrob

martinjrob

    Advanced Member

  • Members

  • 38 posts
  • LocationLancashire
  • Country: Country Flag

Posted 28 March 2013 - 08:49 AM

Hi Batman

 

Thank you for the code but it's still showing as a pink colour.



#6 Danny

Danny

    Is Awesome!

  • Moderators
  • 16526 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 28 March 2013 - 09:01 AM

Hi,

 

 

I recommend using Firebug or your browsers built-in web dev tools and inspect the Carousel section to find the correct code.

 

For assistance visit our custom CSS documentation - 

Please Login or Register to see this Hidden Content

 

You will most likely need to use a PageLines override, I have provide below the correct elements and override to get you started. Apply your background, border etc.. to the code below and it should resolve your pink issue.

 

#site .section-carousel .thecarousel { }



#7 martinjrob

martinjrob

    Advanced Member

  • Members

  • 38 posts
  • LocationLancashire
  • Country: Country Flag

Posted 28 March 2013 - 09:43 AM

Hi Danny

 

Thanks for your reply but the problem i have is i am not sure what code i need to change and i am also not sure of what i am looking for using firebug.



#8 Danny

Danny

    Is Awesome!

  • Moderators
  • 16526 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 28 March 2013 - 09:47 AM

You will need to inspect the Carousel, when you do go through each of the divs until you find where the pink is coming from (see image below).

Please Login or Register to see this Hidden Content



In the image above, I am using Google Chromes we dev tool, you can see the CSS which is used to give the carousel its pink color. You can use this code in the example I gave you in my previous post and replace the pink color with your preferred color.

 

There is a step by step guide on how to use the web dev tool on our custom CSS documentation.

 

Please Login or Register to see this Hidden Content



#9 martinjrob

martinjrob

    Advanced Member

  • Members

  • 38 posts
  • LocationLancashire
  • Country: Country Flag

Posted 04 April 2013 - 10:13 AM

Hi 

I have tried the options you have given to me.

i have used the code

 

 

.section-carousel .thecarousel {
    background-color: #cccccc;
    background-image: -moz-linear-gradient(center top , #cccccc, #cccccc;
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    box-shadow: 1px 1px 0px #cccccc inset;}
 
I am now getting an error message
 
parse error: failed at `background-image: -moz-linear-gradient(center top , #cccccc, #cccccc; ` line: 984
 
please can someone help me and give me some advice on how i can fiw it.
thanks in advance Martin


#10 Danny

Danny

    Is Awesome!

  • Moderators
  • 16526 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 04 April 2013 - 10:20 AM

A parse error means you have an error in your custom CSS. Therefore, you will need to inspect your custom CSS for any errors. From what I can see you're missing a closed ) in the background image code.

 

Also, a quick tip, that gradient CSS is for mozilla browsers, therefore, if you view your site in Chrome, Safari etc... there will be no gradient style. I recommend you view this site for getting the correct gradient code that will work in all browsers.

 

Please Login or Register to see this Hidden Content







Also tagged with one or more of these keywords: Carousel