Blue "Halo" on tabs in Safari - browser

I have a issue on tab in safari specially. I have create tabs and when I select any tab create border blue around it.
I think it's call HALO effect.
You can check it in attached image. I tried to solved this but had no success. How do I remove that blue border when I select a tab?
Any one have a experience in this?

This is a Safari thing, where it adds a blue border around active elements. A simple way to fix it is to add the following to the styling for your tabs:
outline: none;
Example: http://red-team-design.com/get-rid-of-safari-blue-input-outer-glow-once-and-for-all/. This article only talks about input elements, but it works for other elements too.

Related

Attribute inspector for buttons has no background color

Sorry but looks a simple question. In the attribute inspector menu of all my buttons the background color option menu/property disappeared in Main storyboard. I cannot change the color. I can change the text color, the shadow color, the background gives only the option of images but no color?? I rebooted xcode, and the MacBook as well.
I found the issue. On the attribute inspector at the very bottom there is the view section. On the right of the View there was missing "show" word, looks like a bug and that's why I have not seen that I could expand the view. Now that I expanded it I can hide and show with this right button and the keyword show is there again.

How do I set "StyleBoxEmpty" on buttons in Godot?

I'm trying to remove the blue box that appears around focused buttons in Godot. I saw here that it can be done with "StyleBoxEmpty", but the example picture is a broken link. I have looked through all the node properties, but I cannot find it. Can someone clarify how to enable this property?
Okay, I figured it out...
To remove the unwanted blue "style box" border around focused buttons, do the following:
In the inspector for the button node, scroll down until you find "Custom Styles", expand.
Under the focus property, set the null value to StyleBoxEmpty.
Done.

kentico widget config button unclickable

Is there any way to make a widget's config and move buttons be placed at the top of the widget itself.
As it is one has to hover over a widget in order to see which one of the items in the widget zone it belongs to. This is impossible though when the content of the widget is not in the same screen space (I had to zoom out in the browser in order to get the below screenshot) unless you zoom out and then zoom back in.
In this image, there are 3 seperate widgets (red, white and green respectively) in a single widget zone.
Also, when the mouse leaves the widget the widget config/move buttons are no longer visible.
One solution is to right-click on the widget and then scroll up to the config wheel but this is not something I want to tell my editors they have to do.
Has anyone else come across this problem and if so, how did they solve it?
This can happen when you have CSS conflicts. You can use Chrome Inspector, Firebug, or IE developer tool to investigate and see if anthing is 'overlapping' those buttons (often a floating div is overlapping the buttons and intercepting the 'click')
Then once you figure out a css class to make it work, just add it to your style sheet with ".EditMode " before it, this is a special class that is on the body when in page editor.
Example:
.EditMode .MyFloatingDivThatsCoveringTheWidgets {
z-index: 0;
}

some browser problems on my code

my website, has some issues acting different for different browsers.
the red panel appearing under the grey buttons on bottom,seems only ff,not other browsers.
when user clicks one of grey buttons on the bottom,red panel should start under the white panel.but it starts a little bit of its left side.
the white panel on the left side on islerimiz.html(which user clicks middle button on bottom) page should be blurred.i added script for this but it is not doing blurring thing.the same script is on the iletisim.html(which user clicks rightest button on bottom) page and it is working truly.
ie6 errors:
the red point seems as a rectangle.
red panel script is not working.
the background of page and the logo's background should be the same but they seems different
the blurred panel on islerimiz.html page is not appearing at all.the bottom buttons seems true but the active button's color should be black but it seems grey too.besides little pictures should appear when mouse hover on the grey buttons,appears on open position.
the blurred panel on iletisim.html is not appearing.the pictures on the blured panel appears with shadows and shape is rectangle.also the links on that pictures is not clickable.
how can i solve this problems with css.if i couldn't solve with css,i can try jquery but my first choice is css.i have more than one javascript library on index page.but if i remove one of them,some scripts is not working.
almost all of those issues are because you are using pngs. switch them to gifs. apply them in a style sheet wrapped in conditional comments, at least for ie6, and a percentage of that list will go away. your selectivizrCSSForIEselectivizr.js is also targeting greater than ie6. i'm not sure what the red panel script exactly is, but i see you are adding webm file for ie...idk 100%, but i'll say it doesn't support that format either. convert it to media type that ie6 likes, and again, only serve this up in the ie6 conditional comments

Highlight for Current Menu Item not highlighting correctly

I would like the current menu item to stay highlighted when a user is in that section. I set up styles for .current-menu-item. For some reason some styles work and some don't. I used all of these for testing purposes:
.current-menu-item {
color:#F90;
border-bottom:2px solid #fco;
text-decoration:line-through;
background:#000;
}
Background and Text-Decorationare the only styles that work. Any clues why the others do not? I really only want the text color to stay orange (highlighted #f90).
Thanks in advance for any help :)
sandra :)
Your color rule is likely being overridden by a more specific rule. You can investigate this further, using 'Inspect Element' in google chrome, and looking at the styles in the inspector.

Resources