Einfache Tabelle wird nicht größer

Question

Beachten Sie die oberste farbige Tabelle in der Seitenleiste, die LIFESTYLE sagt.

Der Text wird einfach nicht vertikal zur Mitte ausgerichtet und diese Tabelle wird nicht kürzer.

Es ist im Grunde ein benutzerdefiniertes HTML-Modul in Joomla mit Gantry und K2, dass ich etwas PHP in (Using Sourcerer), so dass es seine Tabelle bg Farbe basiert auf einer Reihe von Farben. Einfach richtig?

Da muss irgendwo ein Rand sein, Polsterung, irgendwas und ich kann es nicht finden. Irgendwelche Ideen?

Answer 1

Um absolut ehrlich zu sein, weiß ich nicht, warum dies geschieht, aber das scheint das Problem zu beheben ...

Ersetzen Sie die folgenden Schritte aus:

<div class="titlebars"> 
    <font color="#FFFFFF">LIFESTYLE</font> 
</div> 

mit:

<span class="titlebars"> 
    <font color="#FFFFFF">LIFESTYLE</font> 
</span> 

---

EDIT

Das Problem ist die <br> Tag nach dem <div>:

<td style="vertical-align: middle; width: 100%; line-height: normal; margin: 0px 0px 0px; padding: 0px; cellpadding=0 cellspacing=0"> 
    <div class="titlebars"> 
     <font color="#FFFFFF">LIFESTYLE</font> 
    </div> 
<br> <----- THIS IS THE PROBLEM 
</td> 

es entfernen und die Zelle verhält, wie Sie es möchten.

Answer 2

erklären Sie Ihre .titlebars div als display:inline-block, fügen Sie einige padding, dass die Header ein wenig zu füllen, und Sie sollten alle eingestellt werden:

CSS

.titlebars { 
    display: inline-block; 
    font-size: 30px; 
    font-weight: 800; 
    margin: 0; 
    padding: 5px 0; 
} 

, auch <font>-Tags? Ich glaube, dass sie veraltet sind, also können Sie stattdessen ein -Tag verwenden und das formatieren.