Override Tischbreite von jQuery Theme Roller gesetzt

Ich habe ein Thema von jQuery Theme Roller erstellt und angewendet, um eine Tabelle (DataTable.net).Override Tischbreite von jQuery Theme Roller gesetzt

Das Problem ist, dass die Rolle die Breite mit jQuery auf die Tabelle anwendet und meine Versuche überschreibt, die Breite in meiner CSS-Datei zu definieren. Dies wäre in Ordnung gewesen, wenn nicht ein paar zusätzliche Pixel den Bildlaufbalken erscheinen ließen. Ich möchte eine Breite haben, damit der Balken nicht sichtbar ist, bevor der Benutzer die Größe einer Spalte möglicherweise erhöht.

Ich habe versucht, die Größe einer Spalte zu verringern, aber diese Größe wird auf die anderen Spalten verteilt, die ich glaube.

Wer hat eine Idee, wie man den Stil der Walze übergeht?

Quelle

2012-03-30 Nicsoft

-2

Wenn Sie die Breite mit CSS im style-Attribut festlegen, sollte es alle Regeln innerhalb des Stylesheets außer Kraft setzen. Versuchen Sie außerdem, "! Wichtig" am Ende der Regel hinzuzufügen.

.element { width: 100px !important; }

Quelle

2012-03-30 19:14:40 ryanmcdonnell

! Wichtig ist ein letzter Ausweg. Alles, was Sie brauchen, ist eine neuere Regel der gleichen Spezifität, die, wie Sie sagen, alle anderen Regeln außer Kraft setzen sollte. Oder, wenn die Reihenfolge außerhalb Ihrer Kontrolle liegt, machen Sie es genauer. '#container.element' wird zum Beispiel" gewinnen ". Sie wollen nicht in zu viel Spezifität Krieg engagieren, aber unter Kontrolle gehalten, es ist eine bessere Option als! Wichtig –

Versuchte dies und es hat nicht funktioniert. – Nicsoft

Ich glaube, ThemeRoller Themen geben standardmäßig 100% Breite. Das Schöne daran ist, dass Sie alles in einen anderen Behälter wickeln müssen. Für absolute puristische Semantik-Puristen ist dies ein zusätzlicher Knoten im DOM, der dem Markup nicht den bestmöglichen Zweck bietet. Ich selbst bin bereit, in solchen Fällen einen Wrapper hinzuzufügen.

Ich bin mit Themeroller und ein Raster von Tables (also nicht 100% der Seitenbreite!) Hier ist das Skelett meiner Markup:

<div id="someTable" class="halfbox"> 
    <table id="dataTable-foo"></table> 
</div>

Und die CSS hat ein paar Regeln, aber kocht bis:

.halfbox { width: 50%; /* or fixed pixel value */ }

würde ich 50% bezweifeln buchstäblich perfekt (Ränder, Polsterung, etc.), aber Sie bekommen die Idee funktionieren würde: es ist die Hülle, die die Breite, nicht in der Tabelle bestimmt.

Quelle

2012-03-30 19:19:04

Eigentlich verwende ich auch DataTables. Ich denke, eines der Probleme war, dass ich übergelaufen bin: scroll; auf einem div-wrapper. Wenn Sie diese entfernen, wird die Bildlaufleiste entfernt. Wenn Sie jedoch die Größe einer Spalte (ColReorderWithResize) erhöhen, wird keine Bildlaufleiste angezeigt, aber die Tabelle verwendet den Standardüberlaufwert und wächst außerhalb des Bereichs. Ich denke, ich muss jetzt die Scroll-Funktionen von DT überprüfen ... – Nicsoft

Ich habe deinen Vorschlag ausprobiert und benutze einen Überlauf: auto auf diesem div. Aber das macht nichts. Das Problem ist, dass ich die Breite der Tabelle nicht festlegen kann, daher ist es immer ein bisschen zu weit, so dass die Bildlaufleiste angezeigt wird. Ist es nicht so für dich? Die Verwendung von DT sScrollX macht die Tabelle> 2500px breit ... rate daher, weil ich nicht die Größe jeder Spalte beim Start der Tabelle definiere. – Nicsoft

Nein, keine Bildlaufleiste. Ich stelle auch nicht die Größe aller Spalten ein. Ich gebe manuell einige, aber nicht alle an. Hier ist die Sache mit Tabellen: Spaltenbreiten sind immer eine Richtlinie. Wenn Ihr Tisch "muss", wird er breiter, damit er zu Ihren Inhalten passt. Ich vermute, das ist dein Problem. Ich habe in meiner Antwort oben nicht erwähnt, aber meine TD-Elemente haben auch beide "overflow: hidden" und "text-overflow: ellipsis" auf ihnen gesetzt (letzteres hat eingeschränkte Browser-Unterstützung, aber ich kann damit leben). –

Override Tischbreite von jQuery Theme Roller gesetzt

Antwort

Verwandte Themen