ESP32: website Buttons um-designen

[HaWe]

warum werden denn nun die Buttons oben samt Textstring immer paarweise untereinander gemalt und nicht nebeneinander? Es ist doch kein Zeilenumbruch dazwischen, und jeweils 2 werden samt Textstring immer durch <p>...</p> zusammengefasst, dann müssten sie doch nebeneinander stehen...?

[Moppi]

Im Absatz dürfen Zeilen umgebrochen werden, warum denn nicht? Deshalb nehme ich für so etwas gerne Tabellen nach dem Schema: Tabelle->Zeile->Zellen
Wenn dann noch die Breite für die Zeile und/oder die Zellen festgelegt wird, wird es nicht mehr umgebrochen.
Allerdings kann man zwei Buttons auch in einen Container packen (<div>..</div>) und den mit einer festen Breite versehen, so dass die Buttons nebeneinander stehen bleiben.

MfG

[HaWe]

Ich verstehe es nicht:

warum wird denn hier

ptr+="<p>";
if(led1stat) {ptr +="LED1 Status: ON ";}
else {ptr +=" LED1 Status: OFF ";}
{ptr +="<a class="button button-off" href="/led1off">OFF</a>";}
{ptr +="<a class="button button-on" href="/led1on">ON</a>";}
ptr+="</p>";

jetzt alles untereinander gesetzt und nicht nebeneinander?

[Moppi]

Bei HTML orientiert sich alles immer am Endgerät, also am Display. Deshalb ist die erste Frage, ob die Buttons nebeneinander auf dem Display angezeigt werden können. Wenn das theoretisch gerade so passt, dass die beiden Buttons genau so breit sind, wie das Display, dann wird zu 99.9% umgebrochen und der zweite Button rutscht eine Zeile tiefer. Dazu muss man sich mehr mit HTML auseinandersetzen. Zu den HTML-Elementen gehören noch innere und äußere Rahmen, die zur Breite des Elements addiert werden. Wenn das nicht zur Displaybreite passt, wird umgebrochen. So ungefähr kann man sich das vorstellen.

Probeweise kann das "<p>" ersetzt werden durch "<div>" und das "</p>" durch "</div>".
"<div>" gibst Du eine feste Breite, versuchsweise mit: "<div style='width:1000px'>".

Das ist noch keine Endlösung, aber irgendwie musst Du Dich da heran tasten.

MfG

[HaWe]

vom Platz her passt es dicke, es gäbe also überhaupt keinen Anlass, dass html hier selbstständig Zeilenumbrüche einfügt.
Lade das Programm doch mal bitte selber hoch und gucke, was bei dir dargestellt wird.

PS,
die url habe ich im (riesigen) Windows-Browser aufgerufen

[jcrypter]

Wie sieht denn der Quelltext der HTML-Seite im Browser aus?

edit: wenn das css aus deinem ursprünglichen posts noch immer drin ist: display:block sorgt dafür, dass jeder "button", eigenlich ja nur ein Link, als block Element interpretiert wird. Und die ziehen sich über die ganze Seite und erzeugen einen Zeilenumbruch.

[HaWe]

ja klar, der Rest des Codes war gleich geblieben - lösche das gleich mal raus und gucke, was passiert!

- - - Aktualisiert - - -

UPDATE:

Jawohl, DARAN lag's!
vielen Dank!

- ERLEDIGT -