Multi-line bullet list in markdown - html

Does markdown supports multi-line (line-break inside the item) bullet list? In HTML, I can put <br> inside it.
Item 1
blah blah blah
Item 2
blah blah blah
UPDATED in Jan 2020
Thank you for your contribution. Two trailing spaces work in the Jupyter environment.

Two spaces at the end of line are used to insert a line-break.
Example (replace the two dots with two spaces!):
* Item..
some indented text
This will render as:
Item
some indented text

A more markdown-friendly alternative (to accepted answer) is to add 2 trailing spaces to the first line.

Alternative to double trailing space you can add a trailing backslash.
* Item 1\
blah blah blah
* Item 2\
blah blah blah
rendered to
* Item 1
blah blah blah
* Item 2
blah blah blah

Oh I just checked <br> also works in markdown too...

You may check out this.
* unordered list
+ sub-item 1
+ sub-item 2
- sub-sub-item 1
* unordered list
+ sub-item 1
+ sub-item 2
- sub-sub-item 1

Related

<li> is not displaying in ie 8 without wrapping <ul>

<p>
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah</p>
<li>
this is a test "li" without a parent "ul"</li>
<li>
this is a test "li" without a parent "ul"</li>
<li>
this is a test "li" without a parent "ul"</li>
<li>
this is a test "li" without a parent "ul"</li>
Above list items will not be displayed in IE8 when not wrapped into an <ul> tag. Is it a bug or the expected behavior ?
The specification requires <li> elements to be a child of specific parent elements. It looks like a parent element to <li> is missing from your example.
Not the spec but Mozilla’s documentation:
The HTML <li> element is used to represent an item in a list. It must
be contained in a parent element: an ordered list (<ol>), an unordered
list (<ul>), or a menu (<menu>).
li stands for "List Element". Therefore, you should enclose them in a ul (unordered list) or ol (ordered list).
li tag alone may likely work in modern browsers (but HTML code will not conform to the standard you are using), but not in Internet Explorer 8!
First this is not the correct syntax to use Li without ol or UL.
If then also you want to display the list in IE 8 without adding ul or ol then try to create a JS function that identifies the IE 8.
Then if it is IE 8 then loop though all the li elements.
Then add '•' character before the text.
It will look similar like bullets with li elements.
• one
• two
• three

aligning a line of text left in a paragraph? CSS/HTML

I have a line of text like so:
I am john doe blah blah blah.
How can I align it like so:
I am john doe
blah blah blah
Several ways:
Set the width of the text container so that the desired line break
occurs
Use <br> where you want the line break
Wrap each 'line' of text in a <span>, and style them with CSS for the desired effect.
The 'right' way really depends on context. Perhaps you could say more about that.
Use the line break element <br>.
Example:
My name is Adam and i live in<br>South Africa.
will display as:
My name is Adam and i live in<br> South Africa

<br style="margin-bottom:8px;"/> not rendering in IE

I'm trying to create a space and a half between the text and the date in my website without using two "< br/ >" tags. The code that you see below works perfectly fine in Firefox but it doesn't work at all in IE. If I use two "< br/ >" tags, it creates too much space and I only want one space and a half without using CSS. I know that I can easily do this with CSS but the code that I have works fine in FF and it just doesn't work in IE. I think for some reason IE doesn't like "margin-bottom" and it's not rendering it all.
Code:
<p class="text">blah blah blah<br style="margin-bottom:8px;"/>17 August 2013, 2:30pm EST</p>
Output in FF:
Blah blah blah blah
17 August 2013, 2:30pm EST
Output in IE:
Blah blah blah blah
17 August 2013, 2:30pm EST
You could use two p tags and control the margin on them or use line-height to give you what you want. I can't comment specifically without seeing more of the code.
But something to try whilst waiting for another answer.

html textarea injecting line breaks

I've got a weird problem.
I have an html textarea, with the cols set to 84, like so:
<textarea id="caseNote_note0" class="txtArea" name="caseNote_note" style="line-height: 1.1em; height: 5em;" wrap="hard" rows="10" cols="84" tabindex="7">blah blah blah</textarea>
The txtArea class is defined as:
.txtArea {
font-family:arial,sans-serif;
font-size:1.0em;
width:99%;
rows:10;
overflow:hidden;
border:none;
font-family:arial,sans-serif;
margin: 0px 3px 0px 3px;
}
The textarea is stretched across almost the whole screen.
When the user types in data, the data all appears in the textarea as you would expect.
However, when you submit the form, the text looks like its been saved with line breaks injected into it.
i.e.
before the save:
-------------------------------------------------------------------------------
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah
-------------------------------------------------------------------------------
after the save:
-------------------------------------------------------------------------------
blah blah blah blah blah
blah blah blah blah blah
blah blah blah blah blah
blah blah blah blah blah
blah blah blah blah blah
blah blah blah blah blah
-------------------------------------------------------------------------------
If I change the cols to be greater than 84 (say 150), the linebreaks appear later (i.e. more text shows before a line break seems to get enetered).
The text is also being saved in the database table with these apparent mystery line breaks.
A wordaround is to set the cols to something really high (like 500), then I guess I wouldn't run into this problem....but I'd rather know why this is happening in the first place.
Any help is appreciated!
Cheers
Jarrett
Remove the wrap attribute. It’s unneeded.
Your problem is caused by the wrap="hard" attribute in the HTML. You can change it to wrap="soft" to wrap the lines on screen but not include them into the submitted data. Alternatively you can change it to wrap="off" to turn wrap off completely - textarea will then include a horizontal scrollbar.
Here's one page describing this in details (this one is from Microsoft), but searching the web for textarea wrap will give you loads more.

Css style to avoid inserting line breaks

My html looks something like this:
<p>blah blah blah blah blah blah <b>something that I want
on a single line</b> blah blah blah</p>
I want to somehow communicate that I want the bold section to start a new line if and only if it can't fit onto the current line. Basically I need a way to say "don't split this across lines if theres any possible way to avoid it"
Is there any facility in html or css to express this?
Try setting white-space: nowrap; on the <b> tag.
You can add non-breaking spaces - - between the words, i.e.
<p>blah blah blah blah blah blah
<b>something that I want on a single line</b> blah blah blah</p>
You can use non breaking spaces between the words by using .
You can use the CSS white-space property with the nowrap value to acheive this.
In your case:
b{
white-space:nowrap;
}
I'd recommend using the <strong> tag rather than the <b> also since the former is semantically more correct.