blockUI - change font-family & remove padded area on overlay? - blockui

Using blockUI. I looked through the options in the documentation, through the plugin itself, and even here on stackoverflow and I can't find where to change the font-family declaration for this. It appears to be using Times by default. Also, the font is displayed over a padded area. Is there a way I can remove that padded area part, I want only the text on top of the dimmed screen. Thanks.

Use message option for this.
Document here http://jquery.malsup.com/block/#options

Related

Wild bug with an icon font - wrong icon displayed

(Ask to answer)
For the project I'm working on we have a custom set of icons, which I converted into a font using https://glyphter.com/ (just googled this type of service and it seemed okay).
Inside one of the block I'm inserting an icon with the class from the CSS generated by the service (like you normally do with an icon font).
And suddenly the displayed icon is wrong - though the content property is okay.
Also could not find any other interfering styles which could do that.
Sorry, no code here, got no time for that. Also the project is quite restricted in terms of sharing details.
So after half a day of looking for a problem and trying different scenarios, it appeared, that the icon font generated had the same icons for the letters in both upper and lower case. And yes, the set started on the letters, not with an extended UTF-8 table (or whatever).
So the parent element had text-transform: uppercase which changed the icon without changing the content or else.
Maybe someone will find this info helpful.

How to limit QPushButton from bieng smaller then the size of its text?

Unexpectedly for myself I found out that buttons impudently ignore the size of the text and easily cut it with a decrease.
Is there something like sizeAdjustPolicy as at QComboBox? If not, what is the correct decision?
In Google and other places I didn't find anything intelligible.
Thanks in advance!
edit2:
I used Qt Style Sheets, cleaned - works fine. Have to give up beauty.
Solution: it was in Qt Style Sheets. If there to use min-width property then something spoils and the button ignores the text size.
To prevent a button from getting too small, set its horizontal size policy to MinimumExpanding. I don't see a reason to use stylesheets for that.
If you wish to manage the size of the button yourself, you can get the minimum size hint of any control by using the minimumSizeHint method.
It was in Qt Style Sheets. If there to use min-width property then something spoils and the button ignores the text size.
You can refer to this question to determine the text size and set the button width according to it using QFontMetrics.

How to use "two-toned" font variants in CSS?

Certain fonts have a variant for outline and filled, and if you use these on overlapping text it draws an outlined or shaded stroke over the filled text. This is different than just an outline that strokes the text like -webkit-text-stroke-color would give you, since sometimes the filled font contains shading or other details.
Here's some examples of fonts designed to be used this way.
http://www.myfonts.com/fonts/matchandkerosene/duotone/
http://www.myfonts.com/fonts/scrowleyfonts/stomp/
I was sort of able to get this to work using CSS like this:
http://jsfiddle.net/6SakC/2/
This creates two H1 spans and uses the top-margin to move the outline one atop the filled one.
However, this doesn't seem ideal to me. Two problems:
I don't want to duplicate the text in the html.
I have to guesstimate the top-margin by trial and error.
If the text wraps, this doesn't work anymore.
Is there a better way to do this? I can live with having to duplicate the text, but I'd really like a more automatic way to do the positioning.
Thanks!
You can place the outline text inside the h1 and use absolute positioning instead of estimating the margin, as in this jsFiddle: http://jsfiddle.net/6SakC/4/
That also solves the problem with the text wrapping.
To avoid duplicating the text in the markup, you can use JavaScript to create the duplicate text, as in this jsFiddle: http://jsfiddle.net/6SakC/5/ (This might not be the best idea, though, since the text might get a moment to display without the outline, and JS is occasionally disabled in the browser settings.)

how to apply css to the input type file for setting width?

i want to set the width of the html tag . And also apply css on the browse button which is provided in the input type file.
I referred the following -
Is there a way to set width of for showing in Firefox?
also referred following-
Setting uniform width in all browsers
but it is for specific browser. It should work on the mozila firefox , netscape navigator, google crome,safari etc. and i don't want to hide the original input control.
how to do this?
The short answer is that you can not really style the input file, and it's like this by design.
how ever, some tricks are available for you, for example:
http://www.quirksmode.org/dom/inputfile.html
You don't. It doesn't work that way.
You can specify the size of the element, but the browser chooses itself how to use that space to display the input field and the button. You can't style the intput field and the button separately.
It's not even specified in the standard that the file input should have an input box and a button. The browser can display the control any way it sees fit, and some browsers displays it differently, for example using a button and a text label.

underline line thickness always one pixel

...regardless of font size.
Its an mx:Text object. (The Text object is actually being used as a mask so don't know if that's the problem.) If underline is set with the <u> tag in Text.htmlText, or Text.textField.setTextFormat, the underline thickness is always just one pixel which is not acceptable. (There are other problems with <u> so I'm limited to using setTextFormat currently.)
Can the thickness of an underline be set through CSS? (textField.styleSheet, etc.)
I may have another problem as I already use setTextFormat extensively, and the documentation says you can't use textField.setTextFormat if you use textField.setStyleSheet.
I primarily need the underline to simulate correctly the look for an anchor tag.
its not even possible to do in html (you need to use border-bottom). i don't think this is possible.
Not possible with CSS or TextFormat.
A possible workaround would be using the textfield metrics (probably through getCharBoundaries()) to manually draw a line under the desired text. It can get quite messy for multiline text though.

Resources