when I type in MathJax a double \overline{\overline{A}},
I get too much vertical spacing.
Is it possible to reduce it in MathJax?
Mathjax example:
Thanks very much.
Davide.
Related
How can I align the below Equation left or right using the below code?
[mathjax url="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"]
MathJax.Hub.Config({tex2jax:{inlineMath:[['$','$'],['\(','\)']]}});
[/mathjax]
$$x=\frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$$
I'm not sure if this is really what you are after, but you can specify how displayed equations are aligned using the displayAlign configuration option, and can specify an indentation with displayIndent. E.g.,
MathJax.Hub.Config({
displayAlign: "left",
displayIndent: "2em"
})
would get you displayed equations that are aligned 2em from the left-hand side of their containers. Perhaps that will do what you want.
I can use text-align="middle" on a text element to center text. Actually this only works nice for the x-direction. For the y-direction I use the hack of Ian G in question Aligning text in SVG.
But what can I do, if a want to center a text in the y-direction, but want to left-align the text in x-direction?
For example, I have a rect-element and a text-element positioned right of it. The text should be vertically aligned to appear centered in relation to the rect. Therefore I use the text-align="middle" property. But I want to left-align the text in the x-direction (since I want to display it at the right of the rect). That doesn't work, since text-align always applies the both, x and y values.
Actually I am not really happy with the vertical alignment in that way and would prefer something else. But didn't find a better solution yet. (I can't use the dominant-baseline attribute, since I am using Batik, which doesn't support it.) I can't even calculate it myself, since in SVG I have no way to query the ascent/descent/baseline of a font.
The baseline-related attributes, as you have discovered, are not universally supported (yet).
One possible solution is to use a method similar to the old CSS trick for vertical centering.
Set the y coord of the text to the vertical centre of the object you want to center on. Then use dy with an em value to adjust the text verically.
<text x="0" y="100" font-family="Verdana" font-size="20pt" dy="0.35em">Some TEXT</text>
The amount of dy won't be 0.5em as you might think because the visual centre of the font won't be exactly half the em height. It will vary from font to font. But once you find a good dy value for a particular font, it should work for any font-size.
Demo here: http://jsfiddle.net/js88W/1/
Try changing the font-size value to confirm it stays centred.
I am trying to mimic the behavior of markers on white boards and was wondering if it I can do it with svg polylines. I know the stroke width can be set but can be it changed to vary depending on the velocity of the mouse which I can figure out or is it just a constant value for the stroke?
Or if you wanted to use SVG, instead of using a <polyline>, use a series of connected <line>s
You can't have multiple stroke widths in a single polyline element. I think canvas is probably a better fit for this task.
I'm using Raphael to draw rectangles. Whoo-hoo!
Is there a way to right align contents of an SVG file?
Not just text, but shapes as well?
I can do the math and get the computed x value, but I'm looking for the lazy-simple solution.
Thank you.
There isn't. Unlike normal web pages where the window is resized and the content flows into it, when a Raphael paper is resized, there is no sort of flow, so aligning is irrelevant. Instead of setting align=right, you just set the right edge to be the same position you set the width of the paper to be. If you enlarge the paper, you can scale the contents with a single operation. Once you've set the position of the right edge, you've essentially set the align position. You don't need to re-set all edge values when the paper changes size, you just scale everything with one command. Hope that helps
Could someone please explain the CSS line-height attribute. It's like the only one I don't know.
The name is self-explanatory; defines the height of a line of text. This is one CSS property that's easier to show than to explain:
Look at my example here if you want to see the CSS and a working demo: http://jsfiddle.net/G59VX/.
It sets the height of a text line independent of the font-size. If you increase it, the lines will appear to be moving further apart, vertically.
The line-height is just that, it adjusts the full hight of a line of text, irregardless of font size. A healthy line height gives a paragraph of text a little breathing room and can make it much easier on the eyes. I usually do a line-height of 1.25em give or take.
Line-height defines the amount of space used for lines, most commonly in text. The primary use of line-height is making text readable. It is recommended to use unitless values of any other unit that isn’t static like the px unit.
A more detailed use is explained here.