Skip to content

01.03.2007 17:48

6

Problemy z CSS i wyświetlaniem kodu

Ano zauważyłem, że mam paskudny problem z wyświetlaniem tekstu objętego znacznikami < code > < /code >, który to tekst formatowany jest do jednego bloku tekstu, bez linii odstępu itd. Wygląda to paskudnie i nie wiem jak to obejść. Ma ktoś jakiś pomysł na modyfikację CSS?

W tej chwili dzięki pomocy Krzysztofa Kudłacika próbowałem użyć takiej reguły CSS:

[sourcecode language='css']
code {
text-align:left;
positioning:block;
}[/sourcecode]

Jak widać na powyższym kodzie problem jednak nadal występuje, gdyż reguła jest sformatowana tak:

code{
white-space: pre;
overflow: auto;
}

Ktoś wie jak to można obejść?

Dzięki światłym uwagom RaVbakera udało sie ostylować ten nieszczęsny kod. Dzięki wielkie :D

Read more from Blogasek
  • http://www.ravbaker.net RaVbaker

    Po pierwsze nie wiem co to “positioning:” w CSS… Nigdzie nie znalazłem żadnych informacji na ten temat.

    Jeśli chodzi Ci o “block”, to ja z reguł← używałem tego w połączeniu z “display”:
    code{
    text-align:left;
    display: block;
    }

    W CSS istnieje parametr zwany position (http://www.signs.pl/html/s/position.php) {ale odnosi się on do pozycji bloku na stronie!} i overflow (http://www.signs.pl/html/s/overflow.php) {odpowiada on za “nadmiarowy tekst”. Które można zastosować dla “zbyt dużych” bloków. Bo tak rozumiem Twój problem.

    Proponuję:
    overflow: scroll; albo overflow: hidden;
    Przy czym ten drugi nie pokaże po prostu tekstu za blokiem.

  • http://waltharius.pl walth

    Hmmm, dzięki za zainteresowanie.
    Teraz jest tak w css:

    code{
    text-align:left;
    display: block;
    overflow: scroll;
    }

    Niewiele to dało, bo kod jak widać we wpisie jest nadal jako jedna linijka, nie jest rozbity na 4 linijki, tak jak ten sam kod napisany jako normalny tekst.

  • http://www.ravbaker.net RaVbaker

    Znalazłem jeszcze jakieś informacje na temat atrybutu “nowrap” (http://www.signs.pl/html/s/white-space.php).

    Może to Ci pomoże. Gdy ustawisz :
    white-space: pre;
    To html powinien wyświetlać wszystko “jak leci” z wszystkimi spacjami, enterami itp. I wtedy przydaje się atrybut:
    overflow: auto; Który ustawi paski przewijania wyłącznie gdy będą potrzebne.

    Pozdrawiam, Rafał.

  • http://waltharius.pl walth

    Ha!
    Dzięki to było to!
    Teraz ustawiłem:

    code{
    white-space: pre;
    overflow: auto;
    }

    I jak widzę działa :D

    Wielkie dzięki i obiecuję, że wezmę się za ten CSS i (X)HTML :D

  • http://www.ravbaker.net RaVbaker

    Nie ma za co. ;-)

  • http://waltharius.pl walth

    W tej chwili dla znacznika code mam tak ustaione w CSS:

    code {

    white-space: pre;

    overflow: auto;

    text-indent: 0em;

    display: block;

    }

    Spowodowane jest to tym, że wprowadziłem dla tekstu wartość text-indent: 2em; i kod zaczął się trochę przesuwać co musiałem delikatnie zniwelować :)

stat4u