[outline fout] Code met line nummering

[Jurgle]

In een post met PHP, C++, etc: kortom code met line numbers en syntax highlighting, zijn de code-regels minder hoog dan de regelnummers.

Dit houdt in dat de code eerder ophoudt dan de regelnummers en dat als ik bijv. regel 10 opzoek, ik in werkelijkheid regel 15 te pakken heb.

Ik heb afwijkende standaard fonts ingesteld in mn browser, maar dat ZOU natuurlijk geen probleem mogen zijn.

CSS aanpassen?

Groeten,

Jurgen

edit:


Het doet zich de ene keer wel voor en de andere keer niet... Net een groot stuk C++ bekeken en die nummers lopen wel gelijk met de code

[ Voor 18% gewijzigd door Jurgle op 29-09-2003 01:01 ]

[We Are Borg]

Heb je een voorbeeld waar het wel gebeurd? Zou denk ik makkelijk zijn voor de parse devvers om het op te lossen

[crisp]

het is wel handig te weten om welke browser het gaat. Konqueror/Safari is bekend omdat die default een andere line-height hanteren vergeleken met andere browsers (is idd met CSS op te lossen), en Mozilla laat dubbele witregels maar als 1 witregel zien omdat om duistere redenen de pre-tag een display:inline meegegeven wordt.

[ Voor 17% gewijzigd door crisp op 28-09-2003 22:44 ]

[Jurgle]

Ik gebuik MyIE2, die relied op MS IE en ik heb MS IE 6.0.

In de 'standaard windows internet opties' heb ik bij 'general'->'fonts' ingesteld:
Web page font: Verdana
Plain text font: Lucida Console

Het voorbeeld van hoe dit bericht uit deze thread er bij mij uit komt te zien kun je hieronder zien (als m'n server stabiel genoeg is )

[ Voor 17% gewijzigd door Jurgle op 29-09-2003 00:59 ]

[We Are Borg]

Ligt aan je font ben ik bang. Dezelfde browser geeft hier namelijk geen probleem

[Jurgle]

Maar user's font instellingen kan je overriden met CSS, het zou toch niet uit mogen maken wat voor fonts een user heeft ingesteld?

Met C++ code heb ik het probeem trouwens niet, dus daar is het al afgevangen...

[crisp]

C++:

test

c++ blokken zitten in een <code> tag, mogelijk geeft je browser daar een ander lettertype bij.

volgens mij is dit met line-height en het expliciet opgeven van een lettertype ne lettertype grootte trouwens ook af te vangen.

[ Voor 51% gewijzigd door crisp op 29-09-2003 12:37 ]

[curry684]

Ik heb met C++ lange tijd hetzelfde gehad, dit is vervolgens wel opgelost in een highlighterengine update... maar tegenwoordig gaat het bij mij iig allemaal goed

Heb je al Ctrl+F5 geprobeerd of anderszins je hele cache leeg te knikkeren?

[Jurgle]

Dat is eigenlijk waarom ik MyIE2 gebruik, die gooit alle cache en andere rommel weg bij het afsluiten van de browser.

Mn cache is dus leeg... heb het nog steeds...

crisp schreef op 29 September 2003 @ 12:32:

volgens mij is dit met line-height en het expliciet opgeven van een lettertype ne lettertype grootte trouwens ook af te vangen.

Expliciet opgeven in de windows Internet instellingen kan niet. Of heb je het hier over het expliciet opgeven in de GOT css? (dat is volgens mij de oplossing)

[ Voor 56% gewijzigd door Jurgle op 29-09-2003 12:51 ]

[Wokkels]

We Are Borg schreef op 29 September 2003 @ 08:14:
Ligt aan je font ben ik bang. Dezelfde browser geeft hier namelijk geen probleem

Nou, ik heb het ook hoor, en ik heb niets ingesteld qua fonts in IE. Gewoon alles standaard.


_{*klikkerdeklik*}

Zoals je ziet doet hij het bij mij nog iets anders dan bij Jurgle.

Ik zie trouwens net dat de C++-code in bericht [rml]madwizard in "[ Algoritme (elke taal)] Verschillen tuss"[/rml] het ook heeft in hetzelfde topic.

[ Voor 43% gewijzigd door Wokkels op 29-09-2003 14:18 . Reden: Klikbaar gemaakt :Y) ]

[Jurgle]

Correctie, inderdaad, bij C++ blokken heb ik het TOCH ook

[crisp]

Het lijkt er op dat er recentelijk toch iets is gewijzigd, hier in IE5.5 gaat het ook fout in alle codeblokken met highlighting...

[Rataplan]

Bij [code=C#] wordt netjes hetzelfde monospaced font voor de regelnummering gebruikt, in alle voorbeelden hierboven zijn de fonts van de code en de regelnummering afwijkend. Dat lijkt mij geen clientside probleem; ik snap ook niet helemaal waarom er twee verschillende fonts gebruikt worden...

voorbeeldcode:	plaatje van hoe het er bij mij uitziet:
C#: 1 2 3 4 5 C++: 1 2 3 4 5

[ Voor 35% gewijzigd door Rataplan op 29-09-2003 16:29 ]

[We Are Borg]

Wokkels schreef op 29 September 2003 @ 14:07:
[...]

Nou, ik heb het ook hoor, en ik heb niets ingesteld qua fonts in IE. Gewoon alles standaard.

[afbeelding]
_{*klikkerdeklik*}

Zoals je ziet doet hij het bij mij nog iets anders dan bij Jurgle.

Ik zie trouwens net dat de C++-code in bericht [rml]madwizard in "[ Algoritme (elke taal)] Verschillen tuss"[/rml] het ook heeft in hetzelfde topic.

[afbeelding]

Bekijk net een topic ( [rml][ PHP] fopen - fread - fwrite probs[/rml] ) en heb het ook.

Kortom, idd een bugje

[ACM]

Bij dat topic gaat het nu goed, als het goed is?

De stylesheet is vanmiddag aangepast dat de beide helften een monospace font met opgegeven grootte hebben.

[crisp]

ACM schreef op 29 september 2003 @ 18:41:
Bij dat topic gaat het nu goed, als het goed is?

De stylesheet is vanmiddag aangepast dat de beide helften een monospace font met opgegeven grootte hebben.

Juist sinds vanmiddag gaat het naar mijn idee fout in IE (hier thuis @ IE6 nu ook). Misschien toch expliciet nog een line-height toevoegen?

offtopic:
waarom testen jullie het zelf niet eerst in verschillende browsers? Dit is wel heel erg obvious

[ Voor 13% gewijzigd door crisp op 29-09-2003 18:51 ]

[ACM]

ik heb het in mozilla en IE bekeken crisp, iig in het voorbeeld van we are borg.

Hmm, zo te zien gaat het goed met php en fout met c/c# code
Handig...

[ Voor 33% gewijzigd door ACM op 29-09-2003 18:51 ]

[Hahn]

Hier in IE6.0 met SP1 doet het voorbeeld van We Are Borg het anders nog steeds niet goed hoor

Ooh je was er zelf ook al achter

[ Voor 17% gewijzigd door Hahn op 29-09-2003 18:52 ]

[crisp]

ACM schreef op 29 September 2003 @ 18:50:
ik heb het in mozilla en IE bekeken crisp, iig in het voorbeeld van we are borg.

Hmm, zo te zien gaat het goed met php en fout met c/c# code
Handig...

Ik zie dat het juist met php codeblokken fout gaat (ja, cache gecleared)
edit: C++ blokken zijn ook nog fout...

[ Voor 36% gewijzigd door crisp op 29-09-2003 18:56 ]

[ACM]

hmmm, darn.

stomme caches, in IE gaat het nu bij beide fout en in mozilla bij php goed...

[crisp]

ACM schreef op 29 September 2003 @ 18:54:
hmmm, darn.

stomme caches, in IE gaat het nu bij beide fout en in mozilla bij php goed...

Misschien gevalletje Cheatah vragen? En anders wil ik vanavond ook nog wel even kijken en testen in verschillende browsers

[decramy]

[zeurmodus]
Moz firebird LINUX heeft de gebruikte lettertypes niet... Die maakt er ook een puinzooi van....
[/]

[crisp]

ACM: misschien gewoon de oude situatie herstellen, en er nog eens goed naar kijken? Ik heb het idee dat deze fix meer stuk heeft gemaakt dan er al stuk was

[.oisyn]

Bij mijn code highlighter (alles behalve PHP) was het een bekend probleem, en imho opgelost door gewoon hetzeflde font te gebruiken voor de code en de regelnummering. Waarom het nu ineens niet klopt vind ik eerlijk gezegd erg wazig

.edit: overigens is de PHP tag bij mij nu ook verkeerd idd (IE 6), volgens mij was dat voorheen niet zo. Is de stylesheet veranderd

.edit2: yup, codetag is hier ook fout. Iemand heeft zitten prutsen, en ik was het niet

[ Voor 35% gewijzigd door .oisyn op 29-09-2003 22:27 ]

[ACM]

Ok, met een beetje hulp van Cheatah nu aangepast, ten eerste had ik het verkeerde veld van de tabel een vaste grootte gegeven (waardoor links wel vast zat, maar rechts niet ) en blijkbaar kregen ze niet dezelfde line-height.

Nu is beide ingesteld, in IE en Mozilla werken ze beide goed, of niet? Hoewel langere c-stukken wel heel lichtjes "out of sync" raken.

offtopic:
Gelijk de OT-tag maar gefixed kwa fontgrootte

[ Voor 8% gewijzigd door ACM op 30-09-2003 10:40 ]

[Rataplan]

ACM schreef op 30 september 2003 @ 10:39:
Nu is beide ingesteld, in IE en Mozilla werken ze beide goed, of niet?

Ja! het werkt goed in IE, bij dertig regels code nog geen last van verschuivingen.

Hoewel langere c-stukken wel heel lichtjes "out of sync" raken.

C++ xor C#?

[ Voor 10% gewijzigd door Rataplan op 30-09-2003 10:45 ]

[crisp]

C++ en C# zie ik geen verschuivingen (ik zoek nog even naar een echt lang voorbeeld )
Ik ben echter niet zo te spreken over het gebruikte font voor highlighted code (C++ en PHP oa). C++ heeft sowieso een kleiner/ander font dan PHP, maar de lettertypes komen een beetje 'priegelig' over. De linenumbering voor PHP daarentegen vind ik er wel goed uitzien (ander lettertype?).

[ACM]

nee, dat zou allemaal hetzelfde moeten zijn kwa lettertypen.
Btw, het is al eerder genoemd in dit topic, maar dit is wel een aardig voorbeeld:
[rml]madwizard in "[ Algoritme (elke taal)] Verschillen tuss"[/rml]

[ Voor 56% gewijzigd door ACM op 30-09-2003 11:19 ]

[crisp]

ACM schreef op 30 September 2003 @ 11:18:
nee, dat zou allemaal hetzelfde moeten zijn kwa lettertypen.
Btw, het is al eerder genoemd in dit topic, maar dit is wel een aardig voorbeeld:
[rml]madwizard in "[ Algoritme (elke taal)] Verschillen tuss"[/rml]

Geen afwijking hier in die lap C++, toch is het lettertype van de nummering bij PHP duidelijk anders dan de code zelf.
Volgens mij is het lettertype van de code bij PHP en C++, en de regelnummering bij C++ hetzelfde lettertype (ws heeft de code van C++ een grotere font-weight), maar deze komt hier dus wat priegelig over.

Bij C++ staat er nog een <code style="color:#000000"> om de lijnnummers en code heen die toch blijkbaar het font beinvloeden. Bij PHP staat er alleen om de code een <code> tag heen en niet om de lijnnummers - dat verklaart denk het verschil. Kan je die <code> tags niet gewoon weglaten?

[ACM]

niet zo makkelijk iig, maar ik zou evt de code-tag in de css hetzelfde font als de td-elementen van die tabel kunnen geven...
Welk font zou je wel mooi vinden?

[ Voor 14% gewijzigd door ACM op 30-09-2003 12:02 ]

[Wokkels]

Nou ik weet iig dat het uitlijnprobleem weg is bij de genoemde voorbeelden.

@ ACM en Cheatah

[crisp]

ACM schreef op 30 september 2003 @ 12:01:
niet zo makkelijk iig, maar ik zou evt de code-tag in de css hetzelfde font als de td-elementen van die tabel kunnen geven...
Welk font zou je wel mooi vinden?

Ik ben nog even aan het testen enzo
Overal <code> gebruiken, en het font in css instellen voor <code> met een font-size van 12px en een line-height van 14px lijkt goed te werken, maar is erg 'dicht op elkaar'. Bij een procentuele line-height gaat het goed bij PHP-code (waar de kleuren mbv vieze font-tags worden gemaakt), maar gaat het fout bij C++ waar de kleuren mbv classes en <span> elementen is geregeld. Het lijk er hierbij op alsof de witregels niet luisteren naar de line-height, want na een witregel begint het af te wijken...

Welk font ik prettig vind voor code? gewoon verdana

[ACM]

Even heel simpel, ik kan atm niet zomaar de uitgespuugde html wijzigen, dus elke wijziging moet in de css zitten.

Voor react 1.9 kan er evt wel wat aan verbouwd worden natuurlijk, maar dat is dan pas over een tijdje werkzaam.

[crisp]

ACM schreef op 30 September 2003 @ 12:41:
Even heel simpel, ik kan atm niet zomaar de uitgespuugde html wijzigen, dus elke wijziging moet in de css zitten.

Voor react 1.9 kan er evt wel wat aan verbouwd worden natuurlijk, maar dat is dan pas over een tijdje werkzaam.

Dat snap ik

Een probleem met IE is dat de linespace calculatie binnen een <code> blok blijkbaar fout gaat als je een niet-proportioneel font opgeeft; zolang je met die <code> blokken zit, zit je dus vast aan een proportioneel font.
In de css staat nu voor de classes phphighlightcode en phphightlightline het volgende:

Cascading Stylesheet:

font-family: mono;

ik vermoed dat de gedachte hierachter was om een generiek font te specificeren, echter zou het dan dit moeten zijn:

Cascading Stylesheet:

font-family: monospace;

Bij de laatste is ook de lijnnummering bij PHP tags hetzelfde font en heb je in ieder geval eenheid. Voor de rest valt er met CSS op dit moment weinig meer te verbeteren volgens mij...

[ACM]

iig nog even monospace van gemaakt

[crisp]

ACM schreef op 30 September 2003 @ 16:30:
iig nog even monospace van gemaakt

That did the trick \o/

[odysseus]

crisp schreef op 28 September 2003 @ 22:40:
het is wel handig te weten om welke browser het gaat. Konqueror/Safari is bekend omdat die default een andere line-height hanteren vergeleken met andere browsers (is idd met CSS op te lossen), en Mozilla laat dubbele witregels maar als 1 witregel zien omdat om duistere redenen de pre-tag een display:inline meegegeven wordt.

For the record: alle posts die hier gelinkt worden waarin code-tags worden gebruikt, werken prima in Konqueror (CVS-versie van een paar dagen oud)

Er is echter één probleem en dat is dit:

Rataplan schreef op 29 September 2003 @ 16:22:

C#:

1
2
3
4
5

Dit rendert bij mij wel de regelnummers op de goede manier, maar het zet de getallen 1 tot en met 5 (de werkelijke 'code' dus) niet netjes onder elkaar, maar *naast* elkaar - vertikaal gecentreerd, dus rond regel 3 ergens. Op de een of andere manier wil Konqueror blijkbaar een BR-tag hebben en ziet hij een newline niet als reden om met een nieuwe regel te beginnen.

Wat het correcte gedrag is weet ik niet - als Konqueror fout zit dan kan ik het misschien wel wijzigen, als React fout zit dan zie ik het graag veranderd: een stuk code van honderd regels die allemaal naast elkaar worden gezet is niet bepaald leesbaar .

[crisp]

odysseus schreef op 30 September 2003 @ 17:28:
[...]

For the record: alle posts die hier gelinkt worden waarin code-tags worden gebruikt, werken prima in Konqueror (CVS-versie van een paar dagen oud)

Er is echter één probleem en dat is dit:

[...]

Dit rendert bij mij wel de regelnummers op de goede manier, maar het zet de getallen 1 tot en met 5 (de werkelijke 'code' dus) niet netjes onder elkaar, maar *naast* elkaar - vertikaal gecentreerd, dus rond regel 3 ergens. Op de een of andere manier wil Konqueror blijkbaar een BR-tag hebben en ziet hij een newline niet als reden om met een nieuwe regel te beginnen.

Wat het correcte gedrag is weet ik niet - als Konqueror fout zit dan kan ik het misschien wel wijzigen, als React fout zit dan zie ik het graag veranderd: een stuk code van honderd regels die allemaal naast elkaar worden gezet is niet bepaald leesbaar .

Volgens mij heeft dat met de style="display:inline" te maken in de <pre> tag; ik kan me niet herinneren dat dat er vroeger ook in stond, en kan me ook geen reden bedenken waarom dat er in gezet zou zijn...
Ik zal vanavond m'n linux bak ook weer eens aanslingeren

[.oisyn]

Hmm, de niet-gehighlighte code ziet er nu anders uit dan de wel gehighlighte code...

Voorbeeld:

C++:

struct FunctionNode
{
    void * address;
    __int64 startTime, endTime;
    FunctionNode * parent, * child, * next;

    FunctionNode () : parent (0), child (0), next (0)
    {
    }

    FunctionNode (FunctionNode * pParent, void * pAddress) : parent (pParent), address (pAddress), child (0), next (0)
    {
        QueryPerformanceCounter ((LARGE_INTEGER *)&startTime);
        endTime = startTime;
    }
};

FunctionNode root;
FunctionNode * current = &root, * last = 0;

struct Registers
{
    int edi, esi, ebp, esp, ebx, edx, ecx, eax;
};

void _cdecl registerFunctionCall (int type, const Registers regs, void * retAddr)
{
    if (type == ON_ENTER)
    {
        FunctionNode * n = new FunctionNode (current, retAddr);

        if (last)
            last->next = n;
        else
            current->child = n;

        current = n;
        last = NULL;
    }
    else if (type == ON_EXIT)
    {
        QueryPerformanceCounter ((LARGE_INTEGER *)&current->endTime);
        last = current;
        current = current->parent;
    }
}

Visual Basic:

struct FunctionNode
{
    void * address;
    __int64 startTime, endTime;
    FunctionNode * parent, * child, * next;

    FunctionNode () : parent (0), child (0), next (0)
    {
    }

    FunctionNode (FunctionNode * pParent, void * pAddress) : parent (pParent), address (pAddress), child (0), next (0)
    {
        QueryPerformanceCounter ((LARGE_INTEGER *)&startTime);
        endTime = startTime;
    }
};

FunctionNode root;
FunctionNode * current = &root, * last = 0;

struct Registers
{
    int edi, esi, ebp, esp, ebx, edx, ecx, eax;
};

void _cdecl registerFunctionCall (int type, const Registers regs, void * retAddr)
{
    if (type == ON_ENTER)
    {
        FunctionNode * n = new FunctionNode (current, retAddr);

        if (last)
            last->next = n;
        else
            current->child = n;

        current = n;
        last = NULL;
    }
    else if (type == ON_EXIT)
    {
        QueryPerformanceCounter ((LARGE_INTEGER *)&current->endTime);
        last = current;
        current = current->parent;
    }
}

Persoonlijk vind ik de fontgrootte van de laatste veel duidelijker (dit was ook hoe het origineel was)

[crisp]

.oisyn schreef op 30 September 2003 @ 17:40:
Hmm, de niet-gehighlighte code ziet er nu anders uit dan de wel gehighlighte code...

Voorbeeld:
[...]
Persoonlijk vind ik de fontgrootte van de laatste veel duidelijker (dit was ook hoe het origineel was)

Tsja, ik ook, maar als ik dat dat font (Courier trouwens) test dan raken de lijnnummers uit sync omdat het PHP blok alleen <code> om de code zelf heeft staan en niet om de lijnnummers - IE doet daar toch weer wat anders mee waardoor de lineheight van een <br /> niet de opgegeven lineheight blijft. Met enkel wijzigingen in de CSS krijg je het dus niet goed met een ander font...

[.oisyn]

Dat komt omdat ze voor de regelnummering de PRE tag gebruiken. Ik heb mijn highlighter veranderd, maar blijkbaar gaat VB code niet door mijn highlighter heen (wat wel prima kan overigens)

[crisp]

.oisyn schreef op 30 september 2003 @ 18:30:
Dat komt omdat ze voor de regelnummering de PRE tag gebruiken. Ik heb mijn highlighter veranderd, maar blijkbaar gaat VB code niet door mijn highlighter heen (wat wel prima kan overigens)

Eigenlijk moet het allemaal rechtgetrokken worden, er zijn nu teveel inconsequenties. Ik neem aan dat PHP bijvoorbeeld door de phphighlight() functie getrokken wordt, en die spuugt bv ranzige font tags uit. Verder wijkt dus de layout-code eromheen af.
In feite zijn er 5 scenario's:

-'platte code' -gewoon een <pre>-blok met <hr>'s eromheen gelijk een quote
-code zonder regelnummers en zonder hightlighting
-code zonder regelnummers met highlighting
-code met regelnummers maar zonder highlighting
-code met regelnummers met highlighting

De eerste kan weinig mee mis gaan, de andere 4 zouden er qua font en opmaak ongeveer gelijk uit moeten zien naar mijn mening, dus zouden ongeveer dezelfde layout-code moeten hebben ongeacht welke smaak code.

[crisp]

opgelost als het goed is...