Multiple white space in html
Question
I would like to ensure that my chords above words are separated nicely by multiple white space.
The issue is that when I use pre , it comes out pre-formatted and hence not what I wanted.
Also, with , the code looks very ugly.
What is the best method to solve this?
<pre>Chorus: Em AA common love for each other F#m Bm A common gift to the Saviour </pre> Em A D D7 A common bond holding us to the Lord
Here is the link to the url: http://teach.sg/blog/a-common-love/
2 answers
solution1
1 ACCPTED 2015-05-02 01:18:51
There are some white space characters like   will be useful. You can use 	 for tab. You can also use CSS for this.
solution2
1 2015-05-02 05:48:00
I have an alternative solution, please see if it is suitable for your purposes:
I have nested all chords in a <span class = 'chord'> element, and then used CSS style rules to move the chords up and to the left a little bit. There is a little bit of ugly whitespace with this method, but it is more concise and definitely much more elegant than spamming space characters.
.chord { position: relative; font-size: 0.8em; bottom: 1.5em; right: 2em; width: 0.5em; } p { line-height: 2em; }
<body> <p>A common love <span class='chord'>Em</span> for each other <span class='chord'>A</span> </p> <p>A common gift <span class='chord'>F#m</span> to the Saviour <span class='chord'>Bm</span> </p> <p>A common bond <span class='chord'>Em</span> holding us <span class='chord'>A</span> to the Lord <span class='chord'>D-D7</span> </p> </body>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.