ESP32: website Buttons um-designen

[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 -