Leaderboard

В общем, после очередного совокупления с этими зубчиками, я психанул и в свободные выходные написал генератор зубчиков из градиентов. Все сделано откровенно на коленке, но задачу свою выполняет. Возможно кому-то еще пригодится. Если кто еще не понял о чем речь, то суть сводится к получению вот такой штуки на градиентах: На github выкладывать, смысла особого не вижу, так что живет оно в моем паблике на jsfiddle. Ссылка на jsfiddle: http://jsfiddle.net/alexriz/nfaxengc/ Не много комментариев: .app-tooth { background-image: linear-gradient(rgba(51,70,135,1), rgba(51,70,135,1)), /* background */ linear-gradient(-45deg, rgba(51,70,135,1) 50%, rgba(51,70,135,0) 50%), /* top */ linear-gradient(45deg, rgba(51,70,135,1) 50%, rgba(51,70,135,0) 50%), /* top */ linear-gradient(-45deg, rgba(51,70,135,0) 50%, rgba(51,70,135,1) 50%), /* bottom*/ linear-gradient(45deg, rgba(51,70,135,0) 50%, rgba(51,70,135,1) 50%), /* bottom */ linear-gradient(45deg, rgba(51,70,135,1) 50%, rgba(51,70,135,0) 50%), /* right */ linear-gradient(-45deg, rgba(51,70,135, 0) 50%, rgba(51,70,135,1) 50%), /* right */ linear-gradient(45deg, rgba(51,70,135,0) 50%, rgba(51,70,135,1) 50%), /* left */ linear-gradient(-45deg, rgba(51,70,135, 1) 50%, rgba(51,70,135,0) 50%); /* left */ background-repeat: repeat, /* background */ repeat-x, repeat-x, /* top */ repeat-x, repeat-x, /* bottom*/ repeat-y, repeat-y, /* right */ repeat-y, repeat-y; /* left */ background-position: 0 0, /* background */ -6px 0, 6px 0, /* top */ -6px 100%, 6px 100%, /* bottom*/ 100% -6px, 100% 6px, /* right */ 0 -6px, 0 6px; /* left */ background-size: auto auto, /* background */ 12px 12px, 12px 12px, /* top */ 12px 12px, 12px 12px, /* bottom*/ 12px 12px, 12px 12px, /* right */ 12px 12px, 12px 12px; background-origin: padding-box, /* background */ border-box, border-box, /* top */ border-box, border-box, /* bottom*/ border-box, border-box, /* right */ border-box, border-box; /* left */ background-clip: padding-box, /* background */ border-box, border-box, /* top */ border-box, border-box, /* bottom*/ border-box, border-box, /* right */ border-box, border-box; /* left */ border: 6px solid rgba(0,0,0,0);}Все четыре стороны получаются не очень красиво, но по две противоположные можно использовать, тем более чаще всего именно такие, парные, комбинации и встречаются.

Это противоречит принципу CSS и потому недоступно решается с помощью js

Как то так? $string = "<p><img путь и параметры картинки />текст</p>";preg_match('#<img.*/>#', $string, $res);$img = $res[0];$string = str_replace($img, '', $string);$result = $string.$img;echo htmlspecialchars($result);UPD: Или во так $string = "<p><img путь и параметры картинки />текст</p>";$result = preg_replace('#(<p>.*)(<img.*/>)(.*</p>)#', '$1$3$2', $string);echo htmlspecialchars($result);

https://jsfiddle.net/Jack_V_V/q6gksdv6/embedded/result/ Смотрим в хроме на 150%, старался, душу вкладывал.