I wrote the article about how to make photo slider on steemit three days ago. But I did not tell how I did it. Now it's time. First I decide to write HTML markups that steemit editor support partially. Formatting elements with help of html markups is easier than styling by markdown. HTML Elements usually consists of a start tag and end tag, with the content inserted in between:

<tagname>Content goes here...</tagname>

input

output

<h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6> -------------------------------------- <p>This is a paragraph.</p> <div>This is a division.</div> <a href="url">This is a link</a> -------------------------------------- <pre> defines preformatted text.</pre> <code> code </code> <i>italic</i> <b>bold</b> text<sub>subscripted</sub> text<sub> superscripted </sub> <del> deleted</del> <blockquote> blockquote</blockquote> -------------------------------------- <img src="https://i.imgur.com/HkE0dzj.jpg"> <br /> element (which indicates linebreak) <hr /> element (which creates a line) -------------------------------------- <table> <tr> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> </table> -------------------------------------- <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ul> --------------------------------------

This is heading 1 This is heading 2 This is heading 3 This is heading 4 This is heading 5 This is heading 6 This is a paragraph. This is a division. This is a link < br > element (which indicates a line break) defines preformatted text code italic bold textsubscripted text superscripted deleted blockquote Jill Smith 50 Eve Jackson 94 item 1 item 2 item 3

Today We make slider with help of <pre>

See below what <pre> exactly is?

<pre>
veeeeeeeeeeeeeeery  veeeeeeeeeeeeeeeeery loooooooooooong sentence
</pre>

veeeeeeeeeeeeeeeeeeeeeeeeery  veeeeeeeeeeeeeeeeeeeeeeeeery looooooooooooooooooooooong sentence

It Does not let the browser break the words.

veeeeeeeeeeeeeeeeeeeeeeeeery veeeeeeeeeeeeeeeeeeeeeeeeery looooooooooooooooooooooong sentence

See another example. We dont need any Linebreak element < br >.

<pre>
veeeeeeeeeeeeeeery  veeeeeeeeeeeeeeeeery


loooooooooooong 
sentence
</pre>

veeeeeeeeeeeeeeery  veeeeeeeeeeeeeeeeery
loooooooooooong

sentence

So, I hope you learn some basic knowledge about it.Let us make our slider

<pre>
 <img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg">
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg">
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg">
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg"> 
</pre>

Use   to Add some spaces between images.DON'T press ENTER button between img tags

A common character entity used in HTML is the non-breaking space

<pre>
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg">
&nbsp;&nbsp;
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg">
&nbsp;&nbsp;
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg">
&nbsp;&nbsp;
<img src="http://www.jewornotjew.com/img/people/b/betty_boop.jpg"> 
</pre>

Add links to the images .

<pre>
<a href="url"><img src="https://i.imgur.com/QEH5CZw.jpg"> </a> 
<a href="https://i.imgur.com/QEH5CZw.jpg">
<img src="https://i.imgur.com/QEH5CZw.jpg"></a><a href="url">
<img src="https://i.imgur.com/QEH5CZw.jpg"> </a>
</pre>

Add left - right arrows .

<pre>
 <table>
<td>https://i.imgur.com/KLvyi2B.png &nbsp;&nbsp;&nbsp;&nbsp;</td>
<td> <pre><img src="https://i.imgur.com/xi939SR.jpg">
<img src="https://i.imgur.com/T7guuzZ.jpg"><img src="https://i.imgur.com/QEH5CZw.jpg">
<img src="https://i.imgur.com/NvBM4tj.jpg"><img src="https://i.imgur.com/6bjx9o2.png">
<img src="https://i.imgur.com/bpn8JfO.jpg"><img src="https://i.imgur.com/jTQohcQ.jpg">
<img src="https://i.imgur.com/pmze5ho.jpg"> </pre> </td>
<td>https://i.imgur.com/I4WIsAc.png&nbsp;&nbsp;&nbsp;&nbsp;</td>
</table>
</pre>

<pre>
 <table>
<td>https://i.imgur.com/KLvyi2B.png &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
<td> <pre><img src="https://i.imgur.com/xi939SR.jpg"><img src="https://i.imgur.com/T7guuzZ.jpg"><img src="https://i.imgur.com/QEH5CZw.jpg"><img src="https://i.imgur.com/NvBM4tj.jpg"><img src="https://i.imgur.com/6bjx9o2.png"><img src="https://i.imgur.com/bpn8JfO.jpg"><img src="https://i.imgur.com/jTQohcQ.jpg"><img src="https://i.imgur.com/pmze5ho.jpg"> </pre> </td>
<td>https://i.imgur.com/I4WIsAc.png&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
</table>
</pre>

Watch below how it works on smartphones and tablets. Ipads

I want to get your feedbacks, and I am happy if I can help you. Comment If you try to make your slider on steemit post which you write and have any issues. I can help you.

Don't forget to check out my most recent steemit posts

Anyuta Rai - beautiful Russian Model - Photos	Beautiful Girl 💃of the Day #1	How to Align and float images on Steemit

Make Your Steemit Posts look like Book Pages	Top 10 Most Beautiful Women - Japan	Top 10 Most Beautiful Women - Zimbabwe

Size Your Text 📑and Photos 📸 How many you want - micro sizing	How resize images on steemit - tricks	How to Make Mobile friendly Photo slider◀📸📸📸▶ on Steemit

How get more readers for Your old steemit posts? Boost 🚀🚀your views	Add Your Popular Posts to sidebar of each blog post - Markdown Trick	I try to make my post like my profile

Top 10 Russian Beautiful Women	Top 10 Most Beautiful Women in Sports	Top 10 Most Beautiful Women In The World

10 🔥Beautiful Girls 👯💃of the Day #1	Top 10 Most🔥 Beautiful Women💃 in USA	Top 30 Most Beautiful Indian Girls 💃💃 in one Picture #1

10 🔥Sexy Girls 💃of the Day #2	10 Most Beautiful Woman Golf player in one Picture #2	50 Shades of 1 beautiful Girl - Photo🤳

👍💥Best Styling guides for your steemit💌 posts (multi columns)	🔥Sexy Girl 💃of instagram	Check out my steemit posts - All in One - Week #1

If you think How to donate to this ℒady Just upvote this post and follow me if you like it and want to see more.
If you think others will enjoy this Please ReSteem it!

💃 @ℒadyluck