aligning a line of text left in a paragraph? CSS/HTML - 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

Related

Multi-line bullet list in markdown

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

<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.

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.

Drupal removes tags from body of page

How do I stop Drupal from removing tags from the body of a page??
If I create a page that is organized such as
<p>blah blah</p>
<p>blah blah 2</p>
When I go back and edit - it removes the p and when I publish even without editing it turns into this
blah blahblah blah2
It's really annoying especially when editing pages with a lot of content - because I have to redo everything..!!
What input filter are you using? It sounds like the wrong one is being used.
Sounds like you might be using either plain text or filtered HTML.
From Drupal, details for Filtered HTML:
• Web page addresses and e-mail addresses turn into links automatically.
• Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
• Lines and paragraphs break automatically.
To see and configure your input filters go to admin/settings/filters or /admin/config/content/formats/filtered_html

A div that can't be broken

This is more theoretical, I don't have a use for it currently, but would be nice. I would like to create a div layout in which each section cannot be broken by mismatched tags inside of it.
A simple model:
<div id="navbar">
</div>
<div id="content">
**blah blah blah </div>**<!-- assume this line came from a php include -->
blah blah blah
</div><!-- still related to #content despite the bogus /div above it. -->
Has anyone ever tried to accomplish this, or is this a fools errand?
There is no way to do this. If you have an opening <div> tag, the next </div> tag will close it. Period. Case closed.
If you don't want your <div> to be closed early, then don't print the bogus </div>.
There's always
<div>
<![CDATA[ blah blah </div> ]]>
</div>
But then you can't really make use of the tags inside the CDATA section.
Frames (inline or otherwise) provide some isolation. Anything inside the frame won't close tags outside the frame.
That does happen but the solution is sanitizing what you will output properly, this **blah blah blah </div>**<!-- assume this line came from a php include --> should not be printed, strip the tags or check for valid html before doing so.