Sublime Forum

Zen Coding ( CSS Snippets )

#341

[quote=“Michael”]
You asked where the period was on the keyboard? A period is the ‘full stop’ key, the character, with which, you end a sentence.<<<

Between the < and ? key :smile:[/quote]

Thanks. :stuck_out_tongue:

0 Likes
#342

[quote=“kopax”]

Hello, sorry for not reading all the 35 pages.

I just discovered yesterday ZenCoding for Eclipse.
I wanted to setting it up on my text editor (sublime text 2 for windows)

I have followed all the instruction.
Install Package Control, then CTRL+MAJ+P => install package => Zen Coding.

The ZenCoding package is succesfully installed.

while i try to use it tipping this :

div#something>ul>li.item*6>a>img.something

then press TAB, i don’t get anything;

I try to google this issue and all the tuto stops after the installation of Zen Coding.
What am I doing wrong, i don’t get it !?[/quote]

What version of Sublime are you using, OS and version number?

I copied and pasted your zen code and get the following as I would expect :S

<div id="something">
    <ul>
        <li class="item"><a href=""><img src="" alt="" class="something"></a></li>
        <li class="item"><a href=""><img src="" alt="" class="something"></a></li>
        <li class="item"><a href=""><img src="" alt="" class="something"></a></li>
        <li class="item"><a href=""><img src="" alt="" class="something"></a></li>
        <li class="item"><a href=""><img src="" alt="" class="something"></a></li>
        <li class="item"><a href=""><img src="" alt="" class="something"></a></li>
    </ul>
</div>

[quote=“KmacK”]

[quote=“handycam”]I can confirm this. Zen coding is a great thing, but so far the ST2 plugin is a bit hit or miss.

Using kopax’s example, div#something works as expected. But div#something>ul gives me

div#something><ul id="" class=""> <li><a href="" title=""></a></li> li </ul><!-- / -->

what the hell?[/quote]

div#something>ul>li.item*6>a*1>img.something

Give this a try. You have to be explicit with the a tag. It is a bit hackey but it works.[/quote]

I had this a while back, a custom snippet was intefering/competing with zen coding. HTML auto completion perhaps?

Both your snippets work flawlessly for me (I am on a brand new ST2 with only ZenCoding installed)).

0 Likes
#343

Those work great for me as well, but I have another issue…

Working in an HTML file, if I try and wrap a bunch of paragraphs with

tags by selecting them, pressing Ctrl+Alt+Enter and using p* it converts any dollar signs with numbers in the paragraphs to blackslashes “”.

eg. This:

khasdkhasd $4 bazillion khasdkhasd $4 bazillion khasdkhasd $4 bazillion
Ctrl+Alt+Enter, P, *, Enter

Gives:

[code]

khasdkhasd \ bazillion

khasdkhasd \ bazillion

khasdkhasd \ bazillion

[/code] Instead of the expected:[code]

khasdkhasd $4 bazillion

khasdkhasd $4 bazillion

khasdkhasd $4 bazillion

[/code] This happens for me in a clean installation of Sublime Text 2 Build 2181 x64 (portable package) that I installed Package Control in, restarted, installed Zen Coding using Package Control, restarted.

Can anyone else replicate this, or better still suggest a fix/workaround?

Thanks :smile:

P.S. Windows 7 Pro x64

0 Likes
#344

hi everyone

After update to the last stable version of sublime i noticed the strange behavior of zen coding

when i try to expand
“span.text” i expect to appear

<span class="text"></span>

but instead i get this line

span.text('some text')

Any ideas why this happening?

span.some-text expanded properly.
Here the console output:

command: insert_best_completion {"default": " ", "exact": false} ZenCoding: on_query_completions prefix: u'text' ZenCoding: on_query_completions abbr: u'span.text' ZenCoding: on_query_completions expand_abbr abbr: u'span.text' result: u'<span class="text">${1001:$SELECTION}</span>'

PS sorry for my english

0 Likes
#345 
span.text('some text')

looks more like a jQuery expansion. Perhaps you have other plug-ins/snippets/completions that are conflicting with Zen Coding?

0 Likes
#346

[quote=“agibsonsw”]
looks more like a jQuery expansion. Perhaps you have other plug-ins/snippets/completions that are conflicting with Zen Coding?[/quote]

thanks alot,
you’re right, the culprit turned out to be jQeury-bundle package

0 Likes
#347

This doesn’t work on *.less files, which are basically CSS files. How would I go about fixing that??

0 Likes
#348

RESOLVED!
I need to set true in tab_completion setting:

"tab_completion": true

I installed Zen Coding today and it is not working. After hitting TAB nothing happens. Sublime 2 just insert normal \t character instead of snippet. Please help!
It is strange, because this what I see in logs (I want to expand “bg” snippet):

command: insert_best_completion {"default": "	", "exact": true}
ZenCoding: on_query_completions prefix: u'bg'
ZenCoding: on_query_completions abbr: u'bg'
ZenCoding: on_query_completions expand_abbr abbr: u'bg' result: u'background: ${1001:$SELECTION};'

I use newest Sublime 2 and Mac OSX 10.6.8.
I set “auto_complete” and “auto_match_enabled” to false in sublime.settings.
I have this packages installed:

[code]“installed_packages”:

	"Alignment",
	"Backbone.js",
	"BracketHighlighter",
	"Can I Use",
	"ColorPicker",
	"Default File Type",
	"Djaneiro",
	"ElasticTabstops",
	"Git",
	"IndentGuides",
	"jQuery",
	"jQuery Snippets pack",
	"JsFormat",
	"Package Control",
	"PHP-Twig",
	"SCSS",
	"SideBarEnhancements",
	"SublimeCodeIntel",
	"SublimeLinter",
	"SublimeWebColors",
	"WordHighlight",
	"ZenCoding"
][/code]
0 Likes
#349

Just wondered if anyone else can confirm this bug?

[quote="[-Stash-]"]Those work great for me as well, but I have another issue…

Working in an HTML file, if I try and wrap a bunch of paragraphs with

tags by selecting them, pressing Ctrl+Alt+Enter and using p* it converts any dollar signs with numbers in the paragraphs to blackslashes “”.

eg. This:

khasdkhasd $4 bazillion khasdkhasd $4 bazillion khasdkhasd $4 bazillion
Ctrl+Alt+Enter, P, *, Enter

Gives:

[code]

khasdkhasd \ bazillion

khasdkhasd \ bazillion

khasdkhasd \ bazillion

[/code] Instead of the expected:[code]

khasdkhasd $4 bazillion

khasdkhasd $4 bazillion

khasdkhasd $4 bazillion

[/code] This happens for me in a clean installation of Sublime Text 2 Build 2181 x64 (portable package) that I installed Package Control in, restarted, installed Zen Coding using Package Control, restarted.

Can anyone else replicate this, or better still suggest a fix/workaround?

Thanks :smile:

P.S. Windows 7 Pro x64[/quote]

0 Likes
#350

I can confirm this. Workaround is easy:

select the block
split into lines (shift-command-L)
invoke command as before, ctrl-alt-enter
type p

0 Likes
#351

[quote=“handycam”]I can confirm this. Workaround is easy:

select the block
split into lines (shift-command-L)
invoke command as before, ctrl-alt-enter
type p[/quote]

Thanks for the work around, it’ll certainly come in useful until the issue is fixed - but it doesn’t help much with things like ul>li*>p (I have other far more complex haiku’s than this, but it illustrates the issue just fine).

Yeah, I know, you could just do li*>p and then reselect the list and ul it, but that’s taking half of the benefit of Zen Coding.

Thanks again handycam.

0 Likes
#352

Hi!

Before Sublime i used Notepad++ and use Zen as:
#page>.logo … -> press Ctrl+E -> profit!
but in Sublime it look like this:
Press Ctrl+Alt+Enter -> #page>.logo … -> press Enter -> profit!

How to config Sublime like Notepad++?
Nowhere can not find anything on this issue.

0 Likes
#353

Don’t press ctrl+alt+enter. Type #page>.logo then press TAB.

0 Likes
#354

don’t work

0 Likes
#355

it’s work in css, but not currectly:
d:b -> Tab -> d:background
must be:
d:b -> Tab -> display:block;

0 Likes
#356

Yes it works.
The file must use HTML syntax (showing in the lower right corner of ST2).

0 Likes
#357

I found mistake in my zen-coding.sublime-settings. zen in html working, but in css it still don’t work. may be I upload my settings and you show me my mistakes?))

0 Likes
#358

If you refer to this:

[quote=“technobulka”]it’s work in css, but not currectly:
d:b -> Tab -> d:background
must be:
d:b -> Tab -> display:block;[/quote]

I think that it’s caused by the snippets of the CSS package:
If you look at the completion list, display:block is at the bottom of it.

If you select it, I suppose next time this will be the default value.

0 Likes
#359

damn! nothing dont work. ((
i try to set zen on ctrl+space or ctrl+e, in html works one of two timese:
div - dont work
#id - work
in css:
c - canvas - why?!! i need color:#|; ((
pos:a - pos:abbr - really sad ((

sublime is really awesome program, but i dont want leave it just because i can’t set zen ((
also my is English is bad, difficult to understand.

0 Likes
#360

there is my zen-coding.sublime-settings file from …\Sublime Text 2\Packages\User
dl.dropbox.com/u/7740288/Other/z … e-settings

0 Likes