CSS Text an falscher Stelle, Einrückung, die dort nicht sein sollte.

[smallwall]

Hi,
hier habe ich mal wieder ein CSS Problem:

http://devphp.de/sub/random2.php



Wie auf dem Bild zu sehen ist, ist dort eine Einrückung, die ich nicht möchte. Ich verstehe nicht, wieso es eingerückt wird, wenn dort ein weißer Zug zuletzt steht. Wenn ein schwarzer Zug zuletzt dort steht, ist das Ergebnis zwar auch eingerückt, aber das fällt nicht so auf (stört mich aber trotzdem).
Die Seite verwendet zufällig Partien aus der Datenbank, wenn ihr reloadet könnt ihr eine neue Partie anschauen, falls das Problem nicht beim ersten Aufruf auftritt.

Hat jemand eine Idee, warum es eingerückt wird? Liegt es vielleicht an der Klasse .gameResult?

mfg

 

[John Reese]

Setz mal

text-align: left;

für .text in deinem CSS.

Btw.: Dein Markup ist grauenvoll - so wie du Klassen verwendest, würde ich die nicht verwenden. Außerdem handelt es sich doch dabei semantisch um eine Liste. Wieso benutzt du dann kein <ul>/<ol>?

 

[smallwall]

Tja, die Einrückung liegt tatsächlich am text-align: right; das habe ich benutzt, damit die Züge ab 10. nicht eingrückt sind. Ich müsste dort ein &nbsp o.ä. für die Züge 1.-9. einfügen, damit es ab 10. nicht nach rechts verschoben ist.
Gefällt mir so immer noch nicht.
Gute Idee mit <ol>/<ul>, das JavaScript werde ich demnächst anpassen.
Diese <span>'s für die Züge gefallen mir auch nicht, das habe nicht ich geschrieben, das habe ich von github. Die werde ich auch löschen, wenn es meine bescheidenen Fähigkeiten zulassen.

 

[User007]

Hallo smallwall!

Komisch, bei mir wird's korrekt angezeigt! (siehe angehängtes Bild)

Natürlich lässt sich das besser formatieren, aber wie wär's, wenn Du auf die Schnelle für die Ziffern 1-9 eine Null voranstellst, damit ein einheitlicher Spaltenzug entsteht?

Gruß Ralf

 

[smallwall]

Spaltenzug oder Zugspalte? Wie auch immer, ich habe es geändert wie es CryNickSystems vorgeschlagen hat. Die Idee mit "ein Zeichen voranstellen" wird noch etwas dauern, da ich das JavaScript noch nicht flüssig lesen kann. Ich finde bis jetzt nicht einmal die Stelle wo der Punkt an die Zahl angehangen wird. Es müsste in der Funktion writeGameText() in pgnviewer.js sein, aber bisher habe ich sie nicht gefunden.

 

[User007]

Es müsste in der Funktion writeGameText() in pgnviewer.js sein, aber bisher habe ich sie nicht gefunden.

Nein!
Ist in der chess.js - guck mal ab hier

 /* build the list of moves.  a move_string looks like: "3. e3 e6" */
      while (reversed_history.length > 0) {
        var move = reversed_history.pop();

        /* if the position started with black to move, start PGN with 1. ... */
        if (pgn_move_number === 1 && move.color === 'b') {
          move_string = '1. ...';
          pgn_move_number++;
        } else if (move.color === 'w') {
          /* store the previous generated move_string if we have one */
          if (move_string.length) {
            moves.push(move_string);
          }
          move_string = pgn_move_number + '.';
          pgn_move_number++;
        }

        move_string = move_string + ' ' + move_to_san(move);
        make_move(move);
      }

Gruß Ralf

 

[smallwall]

Cool, Du hast die Stelle einfach so gefunden. Habe jetzt eine Null voran gestellt.

                    if (pgn_move_number <= 9) {
                        move_string = '0' + pgn_move_number + '.';
                    } else {
                        move_string = pgn_move_number + '.';
                    }

Das gefällt mir noch nicht so gut, aber wenn ich &nbsp; voran stelle, kommt nur Murks bei raus. Das &nbsp; wird dann hinten angehangen oder ist anderweitig "out of position". Sehr seltsam.

 

[User007]

Wieso - wo ist Dein Problem? Sieht doch gut aus...

 

[smallwall]

Ja, sieht gut aus, wie gesagt mit der Null. Ich hätte lieber keine 01,02 etc. sondern einfach eine 1,2,3... mit &nbsp; davor. Sprich eine eingerückte einstellige Zahl, keine zweistellige mit einer führenden 0.

 

[John Reese]

Genau dafür kann man ja floaten.

Wenn du deine Zahlen in einen Container mit fixer Breite packst (natürlich groß genug) und dann einfach sagst: text-align: right, dann dürfte es passen (will die Idee nur in den Raum werfen, hab gerade kein Beispiel zur Hand).

 

[smallwall]

Ja, es ist fürchterliches gefrickel, das eine passt einfach nicht zum anderen. Wenn ich in der chess.js dieses benutze

move_string =  '<span class="moveNumber>' + pgn_move_number + '.</span>';

macht der pgnviewer.js das hier daraus


<span <span... etc. ich verstehe nicht, wie die Zugnummer in die Zeile kommt.

m[j] = '<span class="gameMovesSep gameMove' + (i + j - 1) + '"><a class="aMove" href="#" onclick="goToMove(' + (i + j - 1) + ');return false;">' + m[j] + '</a></span>';

 

[r15ch13]

Die Movenummer kommt direkt aus der pgn-File schau doch mal was in gameMoves Variable der pgnviewer.js Zeile 34 steht.
Du splitest da die Movenummer von den beiden Zuegen ab. Ich wuerde es direkt in 3 Teile trennen, dann kann man es spaeter denke ich besser verarbeiten. Ausserdem wuerde ich die <br> rausschmeissen, die sind unnoetig.

 

[smallwall]

Und diesen Thread muss ich auch wieder ausgraben. Es hat sich ein Problem herausgestellt mit meiner Lösung, die chess.js zu verändern. Diese Änderung muss ich rückgängig machen, und in die pgnviewer.js einbauen. Das Ding hätte ich selbst schreiben sollen, es ist einfach zuviel Mist dort.

Das Problem: Wenn ich die Züge (mit meiner Änderung an der chess.js) in die Datenbank schreibe, werden die Züge mit der führenden Null geschrieben. Wenn ich dann die Züge aus der Datenbank hole und mir auf dem Brett anschauen will, versteht die App nicht, dass mit

01. d4 e5 02. dxe5 Ke7 03. e6 Nc6 04. exf7 h5 05. fxg8=N+

eigentlich

1. d4 e5 2. dxe5 Ke7 3. e6 Nc6 4. exf7 h5 5. fxg8=N+

gemeint ist. Es versteht die führende Null nicht, sie gehört dort nicht hin.

Also muss gehört die Null (ich hätte ja lieber ein &nsbp; oder ein anderes Leerzeichen) in den pgnviewer.js.

Hinterher ist man immer schlauer Ich sollte den pgnviewer einfach noch einmal deutlich überarbeiten. Er kommt von github, aber das design passte einfach nicht zu meiner Seite, also werd ich ihn weiter verändern müssen.

Vorschläge werden gern gelesen, zur Zeit gibts immer die aktuelle Preview auf http://devphp.de/pgnrewrite/new_game_board.php

Die Stellen, die Ihr angesprochen habt, werde ich zuerst anschauen....

Ein weiteres Problem hat sich hier herausgestellt (gehört aber nicht in diesen Thread):
http://devphp.de/pgnrewrite/settings.php

Dort wird im Moment noch per PHP das Previewboard eingebunden, beim Versuch das mit jQuery nachzubauen, ist dieses Problem aufgetaucht. Das HTML wird zwar korrekt geschrieben, aber das Brett wird nicht erzeugt. Im Moment müssten eigentlich 2 Bretter sichtbar sein, eins per PHP und eins per jQuery. Das PHP Brett kann ich problemlos auskommentieren, aber das mache ich halt erst, wenn die jQuery Version läuft.

Tipps dazu werden auch gerne gesehen.

Wall of Text....