create180design 1 Report post Posted May 2, 2013 Hi, I am having trouble with my feature slider. http://www.eb5compare.com Three problems: 1) There are 2 light blue vertical lines - one above, and one below - the Inquire Today button that is inside the feature slider (both firefox and safari shows this). I can't seem to get rid of them. I have looked at my code for inserting the image -the lines only go away when i remove the link from the image. I would like to keep the link on the image, but get rid of those two lines. 2) This is a newer problem, since my update, and not sure what I need to do to correct this. Also on the feature slider - home page - the 4 lines of text on the right should be white automatically as I set this feature to white text no background. Originally, these 4 lines were set as h3 text with links- They were underlined and when hovered over, turned red. Now, as h3- they were blue. I have tried som amny options that I lost count as to how I can get this text to be white. In the end I had to remove them from h3 and change the color to white and font size to 24px. Now, they don't have an underline and they don't change color when hovered. When I do manually ad the underline, it shows the line as red behind the white line. I want to get my settings back to the way they were but I can't seem to get anything to take in firebug. 3) My dropdown menu text is white and I don't know how to just adjust the dropdown text to black. Each time I adjust the text it adjusts the main menu text as well. Thank you in advance for your help on this! Share this post Link to post Share on other sites
catrina 103 Report post Posted May 2, 2013 1. I see this issue in Chrome, too, so it's not a browser-specific issue. When you implemented button, are there break (<br>) tags above and below it? 2. What CSS are you currently using for this? 3. You'll need to be more specific with the CSS. There is a specific submenu selector that can be used: ul.sub-menu Please read the docs before posting. Please do not private message me unless I ask you to. Designer | Catrina Dulay Founder | Catrina and Mouse Share this post Link to post Share on other sites
James B 436 Report post Posted May 3, 2013 Hi there The lines are coming from a background shadow by the looks of it, if i turn off the shadow in firebug the lines vanish. http://screencast.com/t/JmraYemn For the lines and the text in the slider I would say remove the css you currently have entered in there and set the text back to the standard links like the were before you changed them to the h3 so we can see the effect, then using css you'll be able to change the text color. We'll need to see the text back to the original status so we can look at helping you find the correct code though. Kindly search the forum and read the documentation before posting. It will help you resolve many issues. For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting. James B Share this post Link to post Share on other sites
create180design 1 Report post Posted May 3, 2013 Thanks for the response. 1) Added the following to remove the shadow and it worked - Thanks! #feature_slider .fcontent a { background-color: rgba(255, 255, 255, 0); } 2) I've also changeed the first and second slider back to its original state. 3) I tried using the selector that you recommended but it did not work. I also tried it without #page #page ul.sub-menu { color: #0b4b82; } Share this post Link to post Share on other sites
Danny+ 1,327 Report post Posted May 3, 2013 Hi, 1. Seems you resolve it. 2. You will need to use custom CSS and target these links. I recommend you use Firebug or your browsers built-in web dev tools, then inspect the element to find the correct code. I sugget you read our custom CSS documentation for assistance with custom CSS. 3. What Catrina provided above is correct. However, you cant simply add your custom CSS to this selector and think thats going to work. You need to follow the DOM. For example, if you wish to change the color of the links in your sub menu, your code would look something like this: #page ul.sub-menu li, #page ul.sub-menu li a { } Please search our forums, before posting! Share this post Link to post Share on other sites
create180design 1 Report post Posted May 3, 2013 I was able to get #1 and #3 resolved. I still have #2. I am trying the following with no luck: #feature_slider .fmedia, #feature_slider .fcontent { color: #FFFFFF; } .fexcerpt p { color: #ffffff; } #feature_slider #feature-area { color: #ffffff; } #feature_slider .fcontent { color: #FFFFFF; } #feature_slider .fcontent h1, #feature_slider .fcontent h2, #feature_slider .fcontent h3, #feature_slider .fcontent h4, #feature_slider .fcontent h5, #feature_slider .fcontent a { color: #FFFFFF!important; } None of these are working. Share this post Link to post Share on other sites
catrina 103 Report post Posted May 3, 2013 You should add #page before the selector(s) to ensure that the CSS is being overwritten properly. Please read the docs before posting. Please do not private message me unless I ask you to. Designer | Catrina Dulay Founder | Catrina and Mouse Share this post Link to post Share on other sites
create180design 1 Report post Posted May 3, 2013 I am trying that but I am still not getting any affect. #page #feature_slider .fmedia .fmedia-pad { color: #FFFFFF; } #page #feature_slider .fmedia { color: #FFFFFF; } #page .feature_slider .fmedia { color: #FFFFFF; } I don't understand where I'm going wrong here. I have been using Firebug for 2 years now understand the general basics of it. But I don't get why I can't change this text color. I'm able to change the color of the Feature Title no problem. Please help me. Share this post Link to post Share on other sites
James B 436 Report post Posted May 3, 2013 .fmedia-pad a Hi there, looking in your code the slides still have inline css applied inside the html code. If you go to the slide via the features tab and click on the 'text' view do you see something like '<span style="color: rgb(255, 255, 255); font-size: 24px;"> EB-5 Visa Program Summary</span>'. This code seems to be overruling the css you're setting. See the screenshot below. http://screencast.com/t/MP94ZlQjskOx It might an idea to remove all the text from the slide and re-enter it and save. Then you're back to the beginning where you hover over and it underlines and you see the link etc. Remember anything you're adding hover css to, you'll need to use the :hover command in the css. You can see this in firebug by click on the little arrow by the 'style' tab and selecting to view hover,active and focus in the css code. They you can edit each of those independently. http://screencast.com/t/QskQSFUsU As you've got the inline css in there, its hard to tell what the code will show when you remove it, but i'd imagine it will be somelike like the following for the hover class. .fmedia-pad a:hover {your css etc;} Kindly search the forum and read the documentation before posting. It will help you resolve many issues. For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting. James B Share this post Link to post Share on other sites