I want to change the border color of any element when it gets focused from blue to green. The problem is I don't know the attribute name I should change to override this. Any help would be very much appreciated.
Below is an image for better comprehension:
Go to http://getbootstrap.com/customize/, look for #input-border-focus, enter your desired color code, scroll down and click "Compile and Download".
Related
I may not have described the issue accurately with the title, but it's easier to explain here:
I have a button that has an icon image contained within it. I need to get rid of the grey box around that icon and keep the icon itself, along with the button functionality. I assigned the button a second class called "nogray", and in my styling sheet I set opacity to 0.
However, this got rid of the entire button, along with the little orange trash bin icon, which I need to be visible. Essentially, I need the button to function the same way, just with the orange icon and no grey box. In this screenie, you can see the buttons at the top of each bulletin note.
Here is the button code in the bulletin notes view:
<button class ="remove-card nogray" id="#item.BulletinId" type="button"><i
class="fa fa-trash"></i></button>
And here is the css for the button:
i.fa.fa-trash::before {
content: "\f1f8";
}
.remove-card.nogray {
opacity:0;
}
(i.fa.fa-trash::before targets the trash icon, and .remove-card.nogray targets the outer gray area. However, I suspect that the latter is targetting the entire button because setting the opacity to 0 affects both gray area and icon.
How would I tweak the button code so that the opacity is 0 only for the grey, and not the icon? I've tried changing the order of the code element by element, but a lot of it is guesswork because this is a team effort and I did not personally write the button code. I'd also like to apologize in advance if this is an impossible question to answer; if there's some detail you need to know, please tell me and I will edit this to include it.
Thank you very much for any suggestions!
I realized I was targeting the wrong lines of code in my css. There was an ActionLink that a teammate commented out, and I assigned the classes from that to my original button code and was able to target the button that way instead.
Is there a way to find the element that contains the href to the current featherlight content when cycling through a gallery?
Basically, I want to change the .featherlight background color to match that of the source element's background color.
As you can seen in this jsfiddle, if I click on an image, .featherlight's background color matches that of the anchor that opened it. I would like the background color to change as I cycle through the gallery, so that .featherlight matches the anchor thumbnail's background color. Is there a way to get that information?
Thanks,
Scott
UPDATE: For anyone seeking the solution, I edited the jsfiddle above so that the color change now works. Thanks to Marc-André.
Yes, I believe what you are looking for is $currentTarget.
Example of usage in this wiki page
Recently i encountered a problem with the dropdown menu called "WHO WE SUPPLY". The main_menu disappear just when i move my cursor over them. I have tried the other answers to similar questions like this but they were not of great help in my case.
I just want the dropdown elements to remain at their places when i move my mouse over them so that i can select them.
Can anyone please check the problem?
My website link is http://effortlessled.com/
Try to go to the WHO WE SUPPLY tab and you will see what exactly i am saying.
Many thanx in advance..
..hope to get a reply soon !!
As far as I can see the "color" property of your "Who We Supply" anchor tag is getting overridden by some other class's color property and the firebug is pointing to line #530 of your style.css file.
The color property mentioned there is "#FFFFFF" which is for white color.
So change the color of that particular class.
Basically the link is not hidden just the color property of that link changes on Hover event to White which is same as your background color
Is it possible to customize the arrow background color of the dropdown using css/css3.
When the border color is default only black arrow seems to be visible.
on apply of border color arrow appears as shown in image
Not interested to open/close div accordingly. looking for some styling to achieve.
The real answer is no. The browsers do not let you change the appearance of those kind of elements, like checkboxes, radio buttons, dropdowns, etc.
However, there are jQuery plugins out there that let you fake it thinking what you see is an authentic dropdown, but in reality it's something else, like an unordered list with a container div that resizes and contracts when you click on it.
i my qt application i have a window and i set the background color of the window as white using "Change stylesheet'when i placed a button its background color is also the white.....i want the green window with button with a background color of grey...how to achieve this?
You need to set the autoFillBackground property to true on the widget.
Otherwise the background color, you have selected, will have no effect.
If this is not the case, please write a better description of the problem.