2017-01-12 2 views
-1

Ihre Hilfe wäre sehr dankbar und wir danken Ihnen im Voraus für das Publikum.CSS- und .tpl-Klassen; text align center

Ich habe ein kleines Problem mit CSS und .tpl-Dateien. Ich baue gerade eine Seite für einen Klienten, der weebly cms benutzt. Was großartig ist. Allerdings verwenden sie jetzt "weniger" anstelle von normalem CSS. Dies bedeutet, dass sie jetzt Teilzahlen und Variablen enthalten. Was ich nicht kenne. Ich möchte einfach einen Text an "center" ausrichten, was im traditionellen CSS immer ein einfacher Prozess ist. In diesem Fall. Die div-Klasse für den fraglichen Text liegt innerhalb der .tpl-Datei in 'partials'. Dem Text in der normalen CSS-Datei ist keine Klasse zugeordnet.

Ich würde gerne wissen, ob ich die Klasse innerhalb der normalen CSS aus der .tpl-Datei hinzufügen könnte. Ich habe versucht, den gleichen Klassennamen aus der .tpl innerhalb von CSS mit ID-Tags und Klassen-Tags, d.

Allerdings ohne Erfolg. Ich bin mir sicher, dass es relativ geradlinig ist, aber ich kann meinen kleinen Kopf nicht herumkriegen.

Jede Hilfe wäre hervorragend, Frohes neues Jahr alle!

Danke

Dies ist der .tpl Code in Frage, wie man die Klassennamen sind einfach zu sehen.

wsite-com-Produkt-Preis wsite-com-Preis wsite-come-catergory-Produkt-Preis

<div class="wsite-com-product-price {{price_class}}"> 
    <div class="wsite-com-price {{! 
     }}{{^is_featured}}wsite-com-category-product-price{{/is_featured}} {{! 
     }}{{#is_featured}}wsite-com-category-product-featured-price{{/is_featured}}"> 
     {{{price_html}}} 
    </div> 

Die CSS bezieht, ist dies: die erste Zeile mein Versuch ist, diese Arbeit zu machen, :

.wsite-com-price .wsite-com-product-price .wsite-com-category-product-price { 
text-align: center; 
} 

einfach möchte ich nur den Preis Mitte ausrichten:

Text align center

Im Folgenden ist der HTML-Code aus Sicht Quelle auf der Seite (wie ich die Klassennamen gefunden, aber sie sind in tpl-Datei nicht die CSS!)

<div class="wsite-com-category-product-name wsite-com-link-text"> 
    Merola Choker 1 
</div> 
</a> 

<div class="wsite-com-product-price "> 
    <div class="wsite-com-price wsite-com-category-product-price "> 
    &pound;125.00 - &pound;165.00 
    </div> 
    <div class="wsite-com-sale-price wsite-com-category-product-price "> 
    &pound;125.00 - &pound;165.00 
    </div> 
</div> 

</div> 
</div> 
<div class="wsite-com-category-product wsite-com-column " data-id="5"> 
    <div class="wsite-com-category-product-wrap "> 

DANK INTERESSIERT FÜR JEDEN THANK !

KORREKTE ANTWORTEN SCREENSHOTS UNTEN >>> DANKE !!!!

enter image description here

enter image description here

+0

Das Einfügen von Leerzeichen zwischen Klassen bedeutet, dass jede nächste Klasse ein Nachfolger des vorherigen ist. Wenn Sie die Leerzeichen entfernen, bedeutet dies, dass das Element alle Klassen haben muss (was ich denke, dass Sie danach suchen) – Pete

+0

'.wsite-com-price .wsite-com-product-price' - das würde ein Element mit der Klasse' auswählen wsite-com-product-price "in einem Element mit der Klasse' wsite-com-price'. In Ihrem HTML ist es umgekehrt. – CBroe

Antwort

1

Versuchen zu verwenden:

.wsite-com-category-product-price {text-align: center;} 

Als Kombinationen von anderen Klassen arbeiten nicht immer.

Oder:

.wsite-com-price, .wsite-com-product-price, .wsite-com-category-product-price {text-align: center} 

alle Preisbezogenen Klassen zu decken.

+1

Liebe Alaksander, Deadfishli und Giker, vielen Dank für Ihre Hilfe. Alle deine Antworten waren korrekt. Ich habe deine Vorschläge umgesetzt und sie haben funktioniert! Der Text ist nun zentriert! Ich habe den Code von euch allen benutzt und voila. Sie sind jetzt zentriert. Ich habe gestern 2 Stunden damit verbracht! Sie haben es innerhalb von 6 Minuten geschafft! Vielen herzlichen Dank! Ich habe Screenshots gemacht, um Ihnen zu zeigen, aber ich bin mir nicht sicher, wie ich sie in Kommentare hochladen soll. Ich werde sie zu meiner Frage hinzufügen, damit Sie die Zufriedenheit Ihrer Antworten sehen können! tolle! Danke noch einmal! Kinds Grüße. Tan – Limtu

+0

Ich habe Ihre Korrekturen in den Screenshots im Fragebereich selbst hinzugefügt! – Limtu

+1

@Limtu bitte upvote und akzeptiere eine der Antworten, wenn sie dir geholfen haben – Pete

1
.wsite-com-price .wsite-com-product-price .wsite-com-category-product-price { 
text-align: center; 

} 

Hier .wsite-com-price wird erwartet, um Elternklasse, die nicht in Ihrem tpl ist. (oder habe ich gefehlt).

.wsite-com-product-price, .wsite-com-category-product-price { 
text-align: center; 
} 

Versuchen Sie dies, wenn das funktioniert, sie Ihnen die Elternklasse verpasst.

Verwandte Themen