0
Hallo,

LESS:
.scrollToTop {
background: #fff url(../images/arrow-up.png) no-repeat center bottom;
}


CSS:
.scrollToTop {
background: #ffffff url(../images/arrow-up.png) no-repeat center bottom;
}


Die Ausgabe ist korrekt. Doch wenn ich während der Entwicklung less.php aktiviert habe, wird aus ../images/.. => /images/...
Das Bild wird also im Root gesucht, was nicht gewollt ist.

Ist das bekannt?

Accepted Answer

Friday, 02. January 2015, 11:40 - #permalink
0
Allgemein gibt es ein Pfad-Problem von LESS gegenüber CSS. CSS schafft relative Pfade, LESS nicht.

// css 
background-image: url('../images/picture.jpg');


// less 
background-image: url('templates/frontend/images/picture.jpg');


Workarround: In LESS den Pfad ab Joomla-Root-Verzeichnis angeben.
The reply is currently minimized Show
Responses (6)
  • Accepted Answer

    Tuesday, 20. January 2015, 10:05 - #permalink
    0
    Hallo, allerdings wenn man ein background-image: data-uri( @it ) setzt (als Base64-Encoded Data ),
    dann funktionier alles wunderbar.
    The reply is currently minimized Show
  • Accepted Answer

    Friday, 27. February 2015, 22:10 - #permalink
    0
    hallo alexey,

    könntest du bitte etwas genauer erklären, wie deine lösung funktioniert?

    alexey klyuevschrieb:
    wenn man ein background-image: data-uri( @it ) setzt (als Base64-Encoded Data )


    was musst ich in less eingeben, wenn mein css so aussehen soll:

    .class-xyz { background-image: url(../images/image.png) }

    ich bin ein absoluter less anfänger...

    vielen dank!
    The reply is currently minimized Show
  • Accepted Answer

    Friday, 05. June 2015, 10:25 - #permalink
    0
    Hallo, ich habe einfach statt
    background-image: url();

    das geschrieben: background-image : data-uri ('');
    dann generiert less ein base64 code.

    viel Spass
    Like
    The reply is currently minimized Show
  • Accepted Answer

    Wednesday, 10. June 2015, 18:48 - #permalink
    0
    hallo alexey,

    vielen dank für deine antwort! :)

    leider führt der code in meinem template zu einem fehler beim kompilieren:
    "0 - ParseError: Unexpected input in template.less on line ..."

    mein code:

    .class-xyz {
    background-image: data-uri ('../images/image.jpg');
    background-position: center;
    background-repeat: no-repeat;
    }

    hast du einen tipp?
    The reply is currently minimized Show
  • Accepted Answer

    Thursday, 18. June 2015, 21:49 - #permalink
    0
    This one is anoying, only thing that I can get to work is like this:

    background-image: url('http://www.mydomain.nl/images/imagename.png');


    So I put the complete url there.
    The reply is currently minimized Show
  • Accepted Answer

    Monday, 22. June 2015, 08:28 - #permalink
    0
    Hm, strange, and without tld (e.g. background-image: url('images/imagename.png');) it don't work?
    The reply is currently minimized Show
Your Reply