i am trying writing some useful snippets for me,i had already written some basics one in my element.sublime-snippet,but i found in emmet-sublime they have some snippet which multiply the elements.
eg : ul>li*3
Result:
<ul>
<li></li>
<li></li>
<li></li>
</ul>
how can i apply logics in my simple snippet xml code.
Related
so i am trying to fetch news from an API, everything is working fine so far, except that i got some issues with the format.
From the API the News are in JSON format, i already got them visible on the page and it looks alright, except for <ul> and <li> items
When using a list, the dots will be over the text, since its closing the tags right after. I have been googling for a while and i haven't found a proper solution, using list-style didn't help.
Here is the preg_replace i use for the list items:
/*[list]*/
$tmpText = preg_replace('#\[list\](.*)\[/list\]#isU', '<ul>$1</ul>', $tmpText);
/*[*]*/
$tmpText = preg_replace('#\[[*]](.*)#isU', '<li>$1</li>', $tmpText);
And this is the output on the page i get with this:
<ul>
<li></li> Halloween content implementation
<li></li> Barber implementation and polishing
<li></li> Additional work on modular vehicles
<li></li> Finishing touches on the ATM interface
<li></li> Implementation of halloween gestures
<li></li> Final preparations for permadeath testing
<li></li> Creation and implementation of new admin commands
<li></li> Additional work on the farming system
<li></li> Bugfixing
</ul>
I am not really sure how to fix this, or how i would get the text between the tags, since its input is always different, i would appreciate some tips
Never mind I just solved my own issue, I had a huge brain fart here.
This is the solution I thought about
/*[list]*/
$tmpText = preg_replace('#\[list\](.*)\[/list\]#isU', '<ul>$1</li></ul>', $tmpText);
/*[*]*/
$tmpText = preg_replace('#\[[*]](.*)#isU', '<li>$1', $tmpText);
This question already has answers here:
Understanding CSS selector priority / specificity
(4 answers)
Closed 3 years ago.
I'm working on a wordpress theme, using Mamp Local Server and SCSS to compile CSS.
I have a JS script for menu interaction because my menu has sub-menus.
This is before script:
<ul>
<li></li> //level 0
<li></li> //level 0
<li> //level 0
<ul class="children"> //level 1
<li></li>
<li></li>
</ul>
</li>
<li></li> //level 0
</ul>
And this is after script:
<ul>
<li></li> //level 0
<li></li> //level 0
<li> //level 0
<ul class="children toggled-on"> //level 1
<li></li>
<li></li>
</ul>
</li>
<li></li> //level 0
</ul>
So I set an SCSS rule like this:
.toggled-on {
display:block;
}
but the element doesn't get the style.
If I change the SCSS rule to this it works:
.children.toggled-on {
display:block;
}
From what I've learned about CSS it should work in both cases.
Where am I going wrong?
As the comments on your original post already suggest, it is probably a specificity problem where another CSS rule is overriding your own.
My Hint: In Firefox you can press Ctrl+Shift+I to open the Inspector. There you can toggle Pseudo Classes like shown in this image:
Then you can see if some other rule is overriding your own CSS rule.
(for example: in the picture shown, min-width of 1264 for html,body is overridden by min-width: auto;) - you can see it is crossed out.
i have html code
<ul>
<li></li>
<li></li>
...
<li></li>
</ul>
How to create template list as picture
i.stack.imgur.com/9jTbC.jpg
Any idea, Thanks
I believe you're trying to achieve masonry template look. This is might be helpful for you: http://masonry.desandro.com/
I've been watching some 'codecasts' on CSSDeck.com, and I frequently see people typing things like this: ul>li*7>a to create a large amount of HTML very quickly. That code would generate this:
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
As seen on: http://cssdeck.com/labs/creating-sweet-3d-pagination
What plugin is this?
It used to be called Zen Coding, but is now called Emmet.
There are plugins for most editors, including Sublime Text 2 (which I'd recommend if you aren't already sorted for one!)
For Sublime Text if you are using Package Control, it's a simple package install emmet away.
How can be printed ordered list from number 6 with html only (if its not possible how should be done)?
Example:
6.home
7.place
8.etc..
9.etc..
Thanks
Use the start attribute:
<ol start=6>
<li>home</li>
<li>place</li>
...
</ol>
Note that its use is deprecated so you shouldn't use it in new documents. The W3C recommends replacing its use by CSS Counters.
(In my humble opinion though, this is partially a mistake, since the number with which a list starts isn't always a pure style choice. Numbered lists carry semantics as well and in this case I consider a number to start with semantics, not style.)
An alternative way in HTML only is:
<ol>
<li value="6">test</li>
<li>This should be 7</li>
</ol>
This allows more flexibility since you can reset numbering mid list but it is still deprecated. As Johannes Rössel said you should use CSS methods if possible.
Are you asking for the syntax for
<ol start="6">
<li></li>
<li></li>
</ol>
However, according to w3.org the start value is deprecated on OL...
This solution may not look efficient but it works (only in IE). This way you don't have to use the deprecated start attribute.
CSS code:
.hideme { display:inline;}
HTML code:
<ol id="num">
<li class="hideme"></li>
<li class="hideme"></li>
<li class="hideme"></li>
<li class="hideme"></li>
<li class="hideme"></li>
<li>home</li>
<li>place</li>
<li>etc</li>
<li>etc</li>
<li>etc</li>
<li>..</li>
</ol>
Though it works, I feel it's ugly.