Leerzeichen zwischen Inline-Text und Eingabeelementen in JADE?

Wie kann man Leerzeichen zwischen Inline-Text und Eingabeelementen in JADE eingeben?Leerzeichen zwischen Inline-Text und Eingabeelementen in JADE?

div(data-role="horizontal", data-theme="a", data-overlay-theme="a", data-inline="true",class="ui-bar ui-grid-c") 
         div(class='ui-block-a') 
          div(data-role='fieldcontain') 
           label(for='memberaddress') Address Proof 
           textarea(id='memberaddress',name='memberaddress') 
         div(class='ui-block-b') 
          div(data-role="fieldcontain") 
           label(for="proof") Proof ID 
           select(name='proof', id='proof', data-theme='a', data-icon='bank', data-inline='true', data-native-menu="false") 
            option(value='0') Select Proof 
            option(value='1') Voter ID 
            option(value='2') Driving Licence 
            option(value='3') PANCARD 
            option(value='4') Ration Card 
         div(class='ui-block-c') 
          div(data-role="fieldcontain")       
           input(type='checkbox', name='addressmatchedCheck', id='addressmatchedCheck', data-inline="true") 
           label(for='addressmatchedCheck') Address Matched

Meine Ausgabe ist: Attached Image is my output

Ich bin nicht in der Lage Raum zwischen Label und Textbereich zu erhalten.

Quelle

2012-10-07 Baskar

das sieht aus wie ein CSS-Problem mehr als ein Jade-Problem. –

Nein, dies ist kein CSS-Problem. Inline-Blockelemente, die nicht direkt nebeneinander gestapelt sind, haben ein paar Pixel Whitespace, während diejenigen, die direkt nebeneinander gestapelt sind, dies nicht tun. Dies ist ein HTML-Problem, das in Templating-Sprachen berücksichtigt werden muss. Slim berücksichtigt dies, indem Sie festlegen können, ob Sie einen nachgestellten Leerraum wünschen oder nicht.Standardmäßig gibt es keinen nachgestellten Leerraum. – Larry

hinzufügen Marge zu Ihrem CSS als jonathan Ong vermuten lässt, oder Sie könnten |   oder span   zwischen Ihrem Label und Textbereich hinzufügen

Quelle

2012-12-04 17:17:39 Pete

'| 'mit mindestens zwei Leerzeichen macht es auch. siehe: http://Stackoverflow.com/a/22220139/1407622 – rriemann

Das ist keine gute Idee, wie ein Commit den nachgestellten Leerraum entfernen kann. –

Rand ist nicht die richtige Antwort. Marge ist CSS. Trailing Whitespace ist ein Verhalten mehrerer Inline-Block-Elemente, die nicht direkt nebeneinander gestapelt sind. Dies ist ein HTML-Problem. Die Verwendung von CSS, HTML-Entitäten oder einer anderen Option ist ein Hack. Jade muss Rechenschaft ablegen für Leute, die tatsächlich hinterlistige Leerstellen wollen. – Larry

Es gibt auch die „hübsch“ Option

Sie sollten Jade nennen können, wie so (siehe http://jade-lang.com/api/):

var fn = jade.compile('string of jade', {pretty: true});

Es wird Zeilenumbrüche und Vertiefungen in der Ausgabe zwischen allen Knoten in Ihrer Vorlage einfügen.

Wenn Sie lieber nur diesen einen Raum einzufügen, ist eine Option

label(for='memberaddress') Address Proof 
=' ' 
textarea(id='memberaddress',name='memberaddress')

Quelle

2015-07-01 01:07:36 leff

'--pretty' (über CLI) und' {pretty: true} '(über API) helfen Ihnen nicht, Leerzeichen zwischen Inline-Elementen zu erhalten. Es bietet nur Leerraum, einschließlich Zeilenumbrüche und Einrückungen, zwischen Blockelementen. – matty

Wie bereits in anderen Antworten bestimmt, wirklich das Problem mit dem HTML ist die Jade schafft anstatt der CSS. Das heißt, eine Möglichkeit, um Platz zu schaffen, ohne das Markup zu ändern, ist, einen Rand rechts von Ihrem label hinzuzufügen.

@leff erwähnt mit =' '. Ich habe das vorher nie gesehen, und ich kann in der Jade-Dokumentation keinen Hinweis darauf finden. Ich liebe es, dass es funktioniert, aber ohne die Dokumente zu sehen, zögere ich, es in der Produktion zu verwenden.

Ich denke, die beste Option ist,   zu verwenden, wann immer Sie Leerzeichen einfügen müssen, um Text zu umbrechen.   funktioniert wahrscheinlich in der Situation, die Sie beschrieben haben, wenn Sie wirklich verhindern wollen, dass Text diese Elemente umschließt. Ich bin eher ein Verfechter dessen, alles einwickeln und fließen zu lassen, also verwende ich normalerweise  , wenn ich sicherstellen muss, dass Jade einen Raum ausspuckt.

Sie finden   und ein paar andere "Leerzeichen" Alternativen auf der w3c character entity reference Seite.

Quelle

2015-07-07 07:18:20 matty

Ich lag falsch mit der Dokumentation für '='. Es ist in der "Code" -Seite von Jade Docs (http://jade-lang.com/reference/code/). – matty

Option 1 (meine Wahl)

input(type='button') 
| &nbsp; 
input(type='button')

Option 2

input(type='button') 
= ' ' 
input(type='button')

Option 3

input(type='button') 
| 
input(type='button')

Es ot sind ihrs aber ....

Quelle

2017-11-17 20:59:22 zhekaus

Leerzeichen zwischen Inline-Text und Eingabeelementen in JADE?

Antwort

Verwandte Themen