You have some web-site with text area in it, example I'm using - http://writer.bighugelabs.com, it is a really neat tool to write texts in, but I have one issue with it - paragraphs in textarea are not indented from each other.
So is it possible to overwrite some CSS properties to get paragraph indent when visiting this site using StyleBot for Chrome as example and what properties? If not possible, then would it be possible with similar extension which can apply custom JS on the page?
Please advice, I've searched for the topic, but didn't quite find the information. I tried to override p margin and padding properties, but with no success as I understand textarea has just a raw text.
Thank you in advance.
Since the text area on the page is really an HTML textarea, you cannot style paragraphs inside it in CSS. There no paragraphs as elements there, just plain text, which may contain line breaks. Modern pages with embedded editor utilities tend to use editable div elements instead of textarea elements, which are rather inflexible.
You could simulate paragraph indents using JavaScript code that inserts one or two no-break spaces after each line break.
Related
JS Fiddle Example
I have a div which contains user generated HTML elements. Each line in the div can be any number of characters, but displays only on one line, and does not wrap. My issue is that partial elements are shown vertically, and due to the variety of HTML elements, I cannot anticipate exactly how many lines of text can fit.
The image below shows the issue, in this case using only list item elements (highlighted with a red arrow.) I've included the HTML and CSS are below as well.
I have been looking for a ReactJS compatible solution to prevent element that do not fit completely from being displayed (I'm open to nearly anything CSS, NPM module, JavaScript snippets, just no jQuery.) All elements needs to remain at a static size, so dynamically resizing the text or container is also not suitable unfortunately.
The solution need only work in Chrome.
Unfortunately despite hours and hours searching for solutions in the form of modules on NPM or CSS solutions such as -webkit-line-clamp, I've found nothing suitable. -webkit-line-clamp will only work (as far as I can tell) on text within a single element, so it will fix a paragraph with 5 lines, but it will not fix 5 single line paragraphs.
Any ideas on how to solve this would be appreciated greatly. I've been struggling with this for months. Thank you very much for reading.
I am trying to create a spell checker for my website using bjspell .Now I want to underline words in textarea that are misspelled.Textarea by default does not support styling specific text.One solution that I thought of was to create divs to replace the textareas but that is not a recommended solution.As this spellchecker needs to be reusable across sites.So I am looking for some alternative where though my content is in textarea.But, it should be possible to style it(just like how it works in firefox).
I have thought of creating a directive for it .It would be applied to textarea for the transformation but I am not getting how it would be done.
There is some help I found in this question (Underlining text of a textarea) but since angular does not recommend dom manipualtion like the one in this question's answer I dont know how to proceed.
Basically I just want bold, italic, underline. Nothing complicated.
I've read from other questions or here that I should use contenteditable.
ie Basic javascript wysiwyg editor
but how do I do the bold, etc from selcted text in the contenteditable box?
I need the bold, etc buttons to by CSSable, so, if I can execute javascript to do bolding, underlining, etc, that would be preferred.
You'll want to define an element as contentEditable. Then you can use execCommand to performs functions on the selected text within the contentEditable element. Documentation on this stuff is scarce... good luck :)
Of course you could use CKEditor or TinyMCE.
BSALSA.com EmbeddedWB has a HTML display control and an EditDesigner that links to it giving you basic editing capability. A slight modification to the EditDesigner.pas Unit and you get near full access to MSHTML execCommand, making it a very easy to code WYSIWYG HTML editor
How can I do some manipulations with the text in a TextBox on resize in Adobe InDesign CS5?
The main goal is too split the last word on every row to achieve something like a custom hyphenation.
Is it possible using JavaScript (or ExtendScript?) ?
Thanks.
UPDATE
I've tried to describe my problem in comments
I need an example on ExtendScript, which would find textbox dimensions and hyphenate the text according to dimension and after I'd like to create an event on textbox resize, which would do the same thing after every resize.
You'll probably be able to write a script to do what you want, but the functionality is already built into InDesign.
If I understand your problem correctly it's InDesign does not hyphenate Armenian properly? You can insert manual hyphenationsin the text using the text tool and pressing 'Ctrl'+'-' where you want the hyphen in the text. Unfortunately you'll have to do that everytime you resize the box, because the words will move around - which is probably the problem you're having.
You can set the language in InDesign in the Character tab (shortcut is 'Ctrl'+'t') and upload custom dictionaries/word lists with rules specific to your language including rules for spelling and hyphenation. Unfortunately I couldn't find Armenian in my short search, but perhaps you're more lucky.
Check out the link for more details:
http://help.adobe.com/en_US/indesign/cs/using/WSa285fff53dea4f8617383751001ea8cb3f-6f4da.html
I wrote a TinyMCE plugin for Wordpress that drops a prepared bit of HTML into the textarea when a button on the toolbar is clicked. This is to assist in formatting some relatively complicated elements.
I would like for this piece of HTML to be wrapped in some sort of container that TinyMCE recognizes and allows for easy selection or deletion if needed.
Currently, the only way to delete an individual element is by erasing all of the information each individual "sub element" contains. I can't seem to find any information in the API regarding manually assigning an element as a singular combined object. As far as behavior goes, think "resize frame" or something similar (only this won't need to have any resizing capabilities).
Any ideas?
If you want to wrap text/html inside an element of your choice (i used a span here) at the current cursor position of tinymce editor instance ed you can simply do
ed.execCommand('insertHTML', false, '<span class="custom_to_delete">My_Text</span>');