I want to write this with emmet:
<p><span class="subtitle">Subtitle:</span> text after subtitle</p>
I've tried this:
li>span.subtitle{Subtitle:}{ text}
li>(span.subtitle{Subtitle:}){ text}
li{ text}>span.subtitle{Subtitle:}
How to put the <span> first then the text inside the <p>?
Related
We can find element by inner text, for example:
<span>
<div>
Example Text
</div>
<div>
Other Text
</div>
</span>
In this case we can use follow xpath: //span/div[contains(text(), 'Example')]
But how can I found element when the text exist out of the tag?
For example:
<span>
<div id="1">
...........
</div>
Example Text
<div id="2">
......
</div>
Other Text
</span>
And shat if, I haven't id on the div tags, and I can't use order?
<span>
...........
<div>
...........
</div>
Example Text
<div>
......
</div>
Other Text
</span>
You can use xpath axes to select siblings.
//text()[contains(.,"Example")]//preceding-sibling::div[1]
You can use this XPath
//span[contains(text(),'Example Text')]//div[#id='1']
For the first div.
The same for the second div
//span[contains(text(),'Example Text')]//div[#id='2']
Generally, in this case the "Example Text" text is contained by the parent span element.
So you can locate the parent span according to this text and then drill down to the child div.
How to show the Text box layout in MVC as text box without having drop down in the side?
In the attached screen shot, we have the drop down lay out. It has to be plain text box.
<div class="form-group">
<div class="col-sm-5 control-label">
<label class="hthin">ExceriseTimes</label>
</div>
<div class="col-sm-1">
<textarea id="ExceriseTimes" asp-for="ExceriseTimes" style="height:25px;" class="form-control" type="text"></textarea>
</div>
</div>
The <textarea> form element doesn't have type attribute, it belongs to <input>. If you want a plain single-line text box, just use <input> tag with type="text" attribute:
<input id="ExerciseTimes" asp-for="ExerciseTimes" style="height:25px;" class="form-control"
type="text" />
However if you want fixed size <textarea> element without scroll bar (looks like spinner in sample image), use both CSS styling overflow:hidden & resize:none:
<textarea id="ExerciseTimes" asp-for="ExerciseTimes" style="height:25px;" class="form-control"
style="overflow:hidden;resize:none"></textarea>
Note: You can apply additional CSS class containing both styles above (e.g. noscrollbar) and append it like class="form-control noscrollbar".
Using bootstrap 3.
I have a list-group-item, but when the width causes the text to pop to the next line, text is cropped, as shown in the picture, on the second line.
What can I do?
This is my code:
<div class="list-group-item getItemActivityHistory" item_id="6">
<div class="text-info"><b>חשמל</b>
<span class="pull-right">נוצל החודש:
<span>
666
</span></span>
</div>
<div>יתרת תקציב: <span class="leftToRight">לא הוגדר</span>
<span class="pull-right">
התחייבויות עתידיות: 100
</span>
</div>
</div>
overflow: hidden; solved the issue.
But I realy do not understand why. "hidden"' should do the opposite.
???
I am using Bootstrap's grid to align an input, a button and an alert message.
However, I found the height of alert message is much higher than that of button and input.
Is there a way to make the height of all elements in grid consistent?
Here is example and code:
https://jsfiddle.net/rktg0L2w/
<div class="container-fluid">
<div class="row" >
<div class="col-xs-3 col-xs-offset-6">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search for...">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Search</button>
</span>
</div>
</div>
<div class="col-xs-3">
<div class="alert alert-success"> Result: </div>
</div>
</div>
</div>
Thanks
Derek
Alert div isn't made to place inside your views. It has it's own padding and margin. It is usually put at the top of page.
However if you want to put it inside your view. You could either make it small by removing padding or make your view vertical align.
I made both alternatives in this https://jsfiddle.net/rktg0L2w/1/
1) For small alter div that matches your input change padding:
.alert-small{
padding: 7px;
}
2) In case you want to make both input and alter vertical align:
Place vcenter class on your row div and alert-large on your alter div.
.vcenter {
display: flex;
align-items: center;
}
.alert-large{
margin-bottom: 0px;
}
Bootstrap has its own standard, however you can change the code by edit the raw bootstrap css or override the bootstrap css code. For example :
padding is the problem in your case, click here for 1st picture
hola, click here for 2nd picture
However, you can make it specific by adding new class or with your superpower and your handsomeness tho
t(.__.t) my life
I recently switch to Sublime Text 3 from Dreamweaver. I use Ctrl+Shift+J for grouping HTML in there so I am looking for its alternative in Sublime Text 3. This feature is available in Sublime Text 3? because I could not find the the key or in menu.
<div>
<div>
<p>
<span></span>
</p>
</div>
</div>
into
Sublime Text can only indent via whitespace. So if you have this:
<div>
<div>
<p>
<span></span>
</p>
</div>
</div>
Then Sublime can't fold it. You need to indent like so:
<div>
<div>
<p>
<span></span>
</p>
</div>
</div>
And now, you'll see fold icons in the gutter - they may be a bit faint. To fold via the keyboard, you can do CTRL+K, CTRL+0-9, or CTRL+Alt+[ to fold and CTRL+Alt+] to unfold.
If it's tag attributes you want to fold, then you can do CTRL+Alt+T
If you're on OSX, then it's CMD instead of CTRL.