Ändern der Position von mehr Info-Text im Dashing-Widget

Question

Ich habe ein Dashing-Dashboard mit einer Reihe von Text-Widgets. Diese haben alle mehr Info-Daten-Tags. Ich fand es notwendig, ziemlich kleine Basisabmessungen für die Widgets zu verwenden.

Hier ist, was ein Widget wie folgt aussieht:

Der .erb Code dieses Widget beschreibt, ist:

<li data-row="2" data-col="2" data-sizex="1" data-sizey="1"> 
 
<div data-id="dc-us01mtd" data-view="Text" data-moreinfo="MTD"></div> 
 
</li>

Also, ich würde einfach bewegen möchte das moreinfo-Tag abbrechen. Ich kann nicht 2 Dinge herausfinden:

1. Was schafft den "Fading" -Effekt, der in der "MTD" -Schriftzug zu sehen ist, und kann es entfernt werden?
2. Wie kann der moreinfo Text näher an den unteren Rand des Widgets verschoben werden, oder vielleicht die "100%" (gesendet an das Widget von einer Veröffentlichungsquelle) nach oben verschieben? Oder beides?

Ich war bisher vollständig nicht in der Lage, dies zu finden. Ich habe wenig CSS-Fähigkeiten, was mich sicherlich zurückhält. Irgendwelche Hinweise oder sogar Vorschläge, wonach ich suchen könnte?

Answer 1

Sie können die Position von Elementen in CSS verschieben, indem Sie die Ränder von Elementen bearbeiten. Zum Beispiel könnten Sie setzen

.more-info { 
    margin-top: 20px; 
} 

in Ihrem Widget CSS-Datei. Dadurch wird das more-info-Element um 20 Pixel im Verhältnis zu seiner Position nach unten verschoben.

Wie für den verbließenden Text musste ich Ihren Code sehen.