Is it possible to change the length of the TAB (\t) character (currently 8 characters) displayed in a XUL <textbox> element ?
Note that I want to avoid replacing TABs with spaces.
The CSS 2.1 spec specifies tabs be rendered as the width of 8 spaces. (Spec) I don't see any mozilla specific CSS to override that value.
Not an expert of XUL, but I would say no. From the docs
https://developer.mozilla.org/en/XUL/textbox
I see no property to set this, nor any setting in the firefox about:config.
Dug through the source for this. It appears that this is hard coded to 8 characters within the layout engine itself.
http://mxr.mozilla.org/mozilla1.9.2/source/layout/generic/nsTextFrameThebes.cpp#2483
Looks like tab replacement is the only option if tab-stop rendering is necessary :(
as we speak, it is possible with -moz-tab-size, and in CSS3, it will (most likely) be possible with tab-size.
Related
Can anyone explane if it is possible to use font-awesome or another big icon font with Element UI? I've seen FAQ but cannot make it work for me.
https://github.com/ElemeFE/element/blob/dev/FAQ.md
Thanks.
You can just include those libraries / or NPM them and they work, Element UI has a limited set of icons so I have include vue-awesome (font awesome) but I notice the position of the icons if out a bit so you need some CSS to adjust top margins (I needed -4px) and line them with say button text.
We tried to upgrade aurelia-dialog from beta.3.0.0 to rc.1.0.3 and found that 2 problems in all our dialog views:
The header does not have width 100% as it was before, it only shows header text, looks like "width:-webkit-fit-content" affected this.
The dialog body became transparent, so we see underlying elements.
How to we avoid this?
Since rc.1 they switched their 'ai' prefix to 'ux', so now you have to type <ux-dialog> instead of <ai-dialog>
This is probably the reason your layout isn't rendering right.
You can see the changelog here
I explicitly set the line-height property of an <input> element in CSS. But when I check the element in firebug, the line-height value of this element is not what I set in CSS. And it seems that the line-height value has nothing to do with what I set in CSS. What is the possible reason for this?
According to the definition of line-height in the CSS 2.1 specification, it has a specific meaning for block container elements and a different meaning for non-replaced inline elements. I can’t find any statement on replaced inline elements there, and an input element can be regarded as a replaced element, somewhat debatably.
Anyway, odd as it may seem, browsers seem to ignore line-height on input elements. As a workaround, you might consider setting the height property, or setting vertical padding. But the results won’t be consistent across browsers. As a rule of thumb, we should expect the rendering of a text input box to the under the control of the browser, though in some cases some features can be tuned using CSS.
not sure if that was the point but i specified margin, padding and got rid of border, here you got exactly 14px: http://jsfiddle.net/mymlyn/Uq5Tt/2/
if you check the dev tools it is (and was before specyfying the above) exactly 14px:
http://dl.dropbox.com/u/26827941/ScreenShot060.png (chrome dev tools)
http://dl.dropbox.com/u/26827941/ScreenShot061.png (firebug in ff)
the reason in your case might be that your input field has a specified id or class,
<input id="someID"/>
and there is something like
input#someID {line-height: 20px;}
in your css somewhere else, andyou might be trying to change its value by setting
input {line-height: 14px;}
if that was not the case im out of ideas :)
The lineheight wont be rendered in firefox but i think it will be in IE. There's a small trick to do, which is to let lineheight style to be rendered as block elements instead of an inline elements.
For example:
This will not work
span {font-size:12px; line-height:14px}
But this will:
span {font-size:12px; line-height:14px; display:block;}
Safari/Chrome Developer Tools indicate that a CSS rule is overridden by something else by striking it through, as shown in the image.
Sometimes I find myself in a situation where I can not figure out from the CSS files what causes this rule to be ignored. But surely Safari itself must know as it strikes it through.
Is there a way to know what overrides such a rule?
Look at the one which isn't striked out, higher up on the list.
Alternatively, view the computed styles. They will be the definitive applied styles.
When you inspect an element, you can show the 'box'. Just bottom of that, you have a 'filter' which should show you every properties being applied to your element.
If you click on a property, it will give you the file and the line number.
Developer Tools will list all rules for an element. Just read through all the CSS rules that apply, and check for a non-struck-through one with the same name.
Go to Elements >> Computed and you'll get the stylesheet that defines the rule you're looking for.
Go to the Computed tab of Chrome Developer tools. Find wanted property and expand details.
is there a way to alter the rendered HTML page in webbrowser control? What i need is to alter the rendered HTML Page in my webbrowser control to highlight selected text.
What i did is use a webclient and use the webclient.Downloadstring() to get the source code of the page, Highlight specific text then write it again in webbrowser. problm is, images along with that page does not appear since they are rendered as relative path.
Is there a way to solve this problem? Is there a way to detect images in a webbrowser control?
Not sure why you need to change the HTML to lighlight text, why not use IHighlightRenderingServices?
To specify a base url when loading HTML string you need to use the document's IPersistMoniker interface and specify a url in your IMoniker implementation.
I suggest you do it a different way, download and replace the text using the webbrowser control, this way your links will work. All you do is replace whatever is in the Search TextBox with the following, say the search term is "hello", then you replace all occurances of hello with the following:
<font color="yellow">hello</font>
Of course, this HTML can be replaced with the SPAN tag (which is an inline version of the DIV tag, so your lines wont break using SPAN, but will using DIV). But in either case, both these tags have a style attribute, where you can use CSS to change its color or a zillion other properties that are CSS compatible, like follows:
<SPAN style="background-color: yellow;">hello</SPAN>
Of course, there are a zillion other ways to change color using HTML, feel free to search the web for more if you want.
Now, you can use the .Replace() function in dotnet to do this (replace the searched text), it's very easy. So, you can Get the Whole document as a string using .DocumentText, and once all occurances are replaced (using .Replace()), you can set it back to .DocumentText (so, you're using .DocumentText to get the original string, and setting .DocumentText with the replaced string). Of course, you probably don't want to do this to items inside the actual HTML, so you can just loop through all the elements on the page by doing a For Each loop over all elements like below:
For Each someElement as HTMLElement in WebBrowser1.Document.All
And each element will have a .InnerText/.InnerHTML and .OuterText/.OuterHTML that you can Get (read from) and Set (overwrite with replaced text).
Of course, for your needs, you'd probably just want to be replacing and overwriting the .InnerText and/or the .OuterText.
If you need more help, let me know. In either case, i'd like to know how it worked out for you anyway, or if there is anything more any of us can do to add value to your problem. Cheers.