Div: Background scrollbar im FF

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Div: Background scrollbar im FF

    Hallo ihr CSS-Profis

    Ich habe ein kleines Problem. Ich wollte ein Div machen, in welchen ich Code schreiben kann (php, html, etc.). Dazu habe ich eine Backgroundgrafik gemacht, die die Zeilennummerierung enthält. Dann hat der Div noch overflow:auto;, damit er das Design nicht sprengt.

    Hier mal mein CSS-Schnipsel:

    Code:
    div.code {
    	background-image:url('../images/line-numbers.png');
    	background-repeat:no-repeat;
    	background-attachment:scroll;
    	overflow:auto;
    	line-height:7px;
    	width:90%;
    	background-color:#eeeeee;
    	border:1px solid #dddddd;
    	padding-top:7px;
    	padding-left:30px;
    	padding-right:13px;
    	font-size:13px;
    }
    Oke, das Problem ist jetzt, dass der FF die Backgroundgrafik einfach nicht mitscrollen will. Also sie bleibt stehen und das ist natürlich nicht gerade günstig bei einer Zeilennummerierung . Kann mir da jemand verraten, wie ich das Scrollen der BG-Grafik dem FF beibringen kann? Am liebsten ohne JS.

    neben bei noch eine Frage: ich habe jetzt immer einen senkrechten Scrollbalken (den kann ich paar Milimeter bewegen), aber er ist immer da. Das ist ja zu nichts zu gebrauchen... wo liegt da der Fehler in meinem CSS-Code? Ich hab ja keine Höhe vorgegeben, also sollte der Div automatisch gestreckt werden und es sollte nicht der overflow einsetzen.
    Zuletzt geändert von pascal007; 10.02.2008, 21:57.

  • #2
    Statt für die Zeilennummern eine Hintergrundgrafik zu verwenden kannst du einen einfachen Trick anwenden: Du nimmst du einzelnen Codezeilen als Listenelemente und nimmst dann eine nummerierte Liste. Die kannst du dann natürlich auch in ein scrollbares div-Element einsetzen.
    Die Regeln | rtfm | register_globals | strings | SQL-Injections | [COLOR=silver][[/COLOR][COLOR=royalblue]–[/COLOR][COLOR=silver]][/COLOR]

    Kommentar


    • #3
      Hm das wäre eine Möglichkeit, aber ich müsste dann den Code-Teil mit PHP zerpflücken und in eine Liste speichern und zudem wird dann, wenn ich etwas rauskopieren möchte, die Zeilennummer mitkopiert. Das ist auch nicht so das wahre.

      Aber ich könnte mich auch damit abfinden, dass ich dem div einfach die Freiheit vertikal lasse. Dann muss ich aber diesen hässlichen Scrollbalken noch wegbekommen.

      Kommentar


      • #4
        zudem wird dann, wenn ich etwas rauskopieren möchte, die Zeilennummer mitkopiert.
        Nein, die Listennummern werden nicht mitkopiert:[list=1][*]a[*]b[*]c[*]d[/list=1]
        Die Regeln | rtfm | register_globals | strings | SQL-Injections | [COLOR=silver][[/COLOR][COLOR=royalblue]–[/COLOR][COLOR=silver]][/COLOR]

        Kommentar


        • #5
          mal geshi ausprobiert? der macht das auch mit zeilennummern.

          gruß
          peter
          Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
          Meine Seite

          Kommentar


          • #6
            Bei mir im Notepad++ wird es als
            Code:
            # a
            # b
            # c
            # d
            kopiert. Kann aber auch nur GeSHi empfehlen!

            Kommentar


            • #7
              Hast du keine URL für uns, damit man sich das mal "echt" ansehen kann?

              Kommentar


              • #8
                Klar kann ich euch ein Beispiel geben. Hoffe es hilft euch weiter. Betrachtet die Codebox mit dem vertikalen Scrollbalken doch mal im FF und dem IE... IE hat zu den Problemen im FF noch weitere (wen wundert's ).

                http://pascal007.homelinux.com/phptu...php?tutorial=1

                Kommentar


                • #9
                  mach es ohne zeilennummern. hab ich auch nicht . oder leg ein preg_match_all drüber, suche nach jedem ersten <br /> nach einem zeilenumbruch und setz dort die zahlen direkt in den code ein. ggf. mit einem zusätzlichen <span>-element, wo du die entsprechende graue formatierung einbaust.

                  und bitte code umbrechen, keiner scrollt gerne horizontal

                  gruß
                  peter
                  Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                  Meine Seite

                  Kommentar


                  • #10
                    Ja, ist mir klar, würd auch gerne umbrechen, aber das Problem ist im Moment dann halt wieder die Zeilennummerierung. Kann ich <code></code> auch beibringen selber umzubrechen, wenn er am Rand des Divs ist.
                    Schade, die Zeilennummerierung hätte ich ein schönes Feature gefunden, aber wenn's denn sein muss ... dann halt ohne. Geht auch.

                    Kommentar


                    • #11
                      du arbeitest doch sicher mit highlight_string, oder? sobald damit der quellcode formatiert wurde, jagst du ein entsprechendes preg_match_all auf <br /> mit den modifiern U und s drüber und baust die zeilennummern per programmierung ein. schau dir ggf. mal das hier an. der rest ist css-formatierung.

                      gruß
                      peter
                      EDIT:
                      ups, korrigiert
                      Zuletzt geändert von Kropff; 13.02.2008, 20:20.
                      Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                      Meine Seite

                      Kommentar


                      • #12
                        Der Link funktioniert leider nicht .

                        Ich lasse die Zeilennummern lieber ganz weg, als wenn danach mit Copy-Paste die Zeilennummern oder sonst ein Zeichen mit kopiert werden. Das Nervt mehr, als keine Zeilennummerierung zu haben .

                        Kommentar


                        • #13
                          ich habe da gerade bei php-friends gesehen, dass die das haben, was du möchtest. schau es dir mal an.

                          gruß
                          peter
                          Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                          Meine Seite

                          Kommentar


                          • #14
                            Meinst du dort wo das Script steht im Thread? Das hat aber einen Bug. Die ersten und letzten 6 Linien werden gar nicht angeschrieben... auf jeden Fall danke für den Tipp, ich werde es mir trotzdem mal anschauen. Vllt kann ich ja was draus machen .

                            Kommentar

                            Lädt...
                            X