If I set the following string into a div how can I get the newline working at HTML?
{
"s":"Phrase1.\n\nPhrase2"
}
Thanks.
Wrap preformatted text in <pre> tags:
<pre>{ "s":"Phrase1.\n\nPhrase2" }</pre>
Shows up as:
{ "s":"Phrase1.
Phrase2" }
Edit: Another option would be to set the div's style or class to behave the same as a pre tag:
<div style="whitespace:pre"/>
foo.innerHTML = myObj.s.replace(/\n/g,"<br>");
{"s", "phrase1.<br /><br />"phrase2"}
Related
In the scenario where the HTML look as follows:
<div>Text</div>
How can I get the value from between these tags ("Text", in this case) to be added as a value of CSS content attribute?
This how I would do it using React's term of that value:
div {
content: attr(children)
}
I don't know why you would need to do this but, you can in a way. I've included an example below but, it would help to know what your objective is.
var elem = document.getElementsByTagName("DIV");
elem[0].setAttribute('children',elem[0].textContent);
div:after {
content: attr(children)
}
<div>Text</div>
div:before{content:attr(data-text)}
<div data-text="text"></div>
i think you want to get that text using css so here is the way to get text via data attribute and css
<div>text</div>
TO
<div data-text="text">
If you want to place same text as data attr then put it
</div>
Now you can simpel put the css like
div:before {
content: attr(data-text)
}
Hope you this will helps you
Thanks
I am using VS Code and tring to create some custom emmet snippets. When I try to make a newline in the snippet it places a space instead.
Here is an example code:
{
"html": {
"snippets": {
"qq": "<div>\n</div>"
}
}
}
When I use the snippet 'qq' it should return:
<div>
</div>
But it returns:
<div> </div>
Any ideas why?
Try to use ${newline} instead. That should produce a new line rather than '\n'.
Is there a way to add white space in MVC while using variables? for example foreach(item in collection) {#item #item}. How to make a blank space something like " " in it?
You can use pre tag , which defines preformatted text.
foreach(item in collection) {
<pre>#item #item</pre>
}
have you tried this can be repeated i.e. you can do line breaks with <br />
In my application I have used a space after the link's name ("Details ") as shown here
#Html.ActionLink("Details ","Details", new { Variable_ID = item.VIP_ID})
#Html.ActionLink("Edit", "Edit", new { Variable_ID = item.VIP_ID })
so my links will look like this: Details Edit, instead of DetailsEdit.
You can also put a separation bar like this "Details | ", so you can have
Details | Edit
<span> </span>
Insert " " to add more blank spaces
//This will work for sure, as MVC C# using razor syntax then you just need to put space between those two only
foreach(var item in collection) {
<span>#item #item</span>
}
If you wish to add single space between item:
foreach(item in collection)
{
<p>#item #item</p>
}
But you will have better flexibility if you wrap it in a HTML element like div or span,
and then add padding/margin to the element using CSS.
foreach(item in collection)
{
<div class="user-defined-classname">#item</div>
<div class="user-defined-classname">#item</div>
}
In CSS
.user-defined-classname{
padding-left|right|top|bottom: 10px
}
Suggestion:
The "Views" folder is specifically meant to just contain your view files (i.e. .cshtml files).
Try adding your CSS file to a folder in the root of the ASP.NET project. Often, this folder is named "Content", but you can rename it as "Styles" or something else. Then you can load your CSS file from within a view using a link tag:
<link href="~/Content/styles.css" rel="stylesheet" type="text/css" />
This may help.
One more variant:
#(string.Format("{0} {1}", item, item))
I have the following string value generated in the controller.
cc.lstchat = "Reply the Number with your question... <br />";
foreach (clsChat item in lstchat)
{
cc.lstchat =cc.lstchat + item.DisplayNumber+". " + item.ChatItem+" <br/> ";
}
Now i'm trying to display above string value inside a div tag in my view but it does not render the line breaks.
<div id="divChat" style="width:400px;height:300px;border:double">
#Model.lstchat.ToString()
</div>
Try the #Html.Raw method
#Html.Raw(Model.lstchat)
Use Html.Raw() it is used to render any string as HTML.
`#Html.Raw("input data in here is rendered as HTML only")`
please please be careful with #Html.Raw() because of HTML injection (eg my comment will be <script>...</script> test - that an XSS right away. If you just want line breaks - consider this answer:
#Html.Raw(Html.Encode(Model.CommentText).Replace("\n", "<br />"))
If I have some Markdown like
## My Title
A paragraph of content here.
code_line(1);
// a code comment
class MoreCode { }
and more text to follow...
How can I set a class on the <code> block that's generated in the middle there? I want to have it output
<code class=’prettyprint’>
code_line(1);
// a code comment
class More Code { }
</code>
But I can't seem to set it. I do not have control over the Markdown code being run, only over the content.
You can embed HTML in Markdown. Type literally what you want, with no indent.
<code class="prettyprint">
code_line(1);
// a code comment
class More Code { }
</code>
For the specific case of syntax highlighting following the back ticks at the start of a fenced code block with the language works just about everywhere these days.
```js
code_line(1);
// a code comment
class MoreCode { }
```
Though not answering the question exactly. You can use a different render too like Maruku or Kramdown:
## My Title
A paragraph of content here.
~~~
code_line(1);
// a code comment
class MoreCode { }
~~~
{: .prettyprint}
and more text to follow...
Output (tested with haml & kramdown):
<pre class="prettyprint"><code>
code_line(1);
// a code comment
class MoreCode { }
</code></pre>
Kramdown syntax: http://kramdown.rubyforge.org/quickref.html#block-attributes
Markdown has an extension (attr_list.py) which allows you to use Maruku's {: .classname} syntax.
Markdown Extra supports class and id attributes using curly braces. See: https://michelf.ca/projects/php-markdown/extra/#spe-attr