Guten Abend,
ich bin Anfänger und bekomme bei folgenden Buttons keine gescheite Anordnung hin, kann mir bitte jemand die korrekte Codierung nennen (bitte ohne die hier oft gelesene Belehrung „setz Dich mehr mit xxx auseinander“ „ist Schrott“ usw.):
[code=html]
[/code]
Besten Dank im Voraus,
Uwe
sieht gerade so aus (s.u.)
Die derzeitige Anordnung der Buttons lässt vermuten, dass deren Elternelement die text-align:center-Eigenschaft besitzt.
Und wie hättest Du sie stattdessen lieber angeordnet? Darauf bist Du in Deinem Post mit keiner Silbe näher eingegangen.
Linksbündig? → text-align:left
Rechtsbündig? → text-align:right
Nein? Ganz was anderes?
Nicht drei-, sondern einzeilig?
Mehr (vertikaler/horizontaler) Abstand zwischen den Buttons?
… oder oder oder?
Die für Dich gescheit empfundene Anordnung bitte uns gescheit erläutern, und neben dem FB-Codesnippet auch das CSS (in [plain][/plain]) zeigen, da sich offensichtlich eine der darin definierten formalen Rahmenbedingungen für Seite und Inhalt an dieser Stelle des HTML-Codes negativ auf diese Elemente auswirkt.
Der Link zur (Test/Fehler)Seite wird von uns natürlich immer präferiert 
Hallo,
vielen Dank für die Antwort. Hier mal das Resultat meiner verzweifelten und erfolglosen Versuche:
[code=html]
Und die CSS dazu:
[code=css].social-single {
margin: 17px 0 0 30px; width:100%;
}
#likebutton {
float: both;
margin-left: 0px;
margin-top:0px;
}
#googlebutton {
float: both;
margin-left: 0px;
margin-top:6px;
}
#copyscapebutton {
float: both;
margin-left: 0px;
margin-top: 1px;
}[/code]
Es wäre schön, wenn der FB und der G+ Button nebeneinander und seitenzentriert und auf gleicher Höhe stünden und der copyscale darunter und zentriert.
Vielen Dank schonmal für die Tipps und übt bitte Nachsicht, ich bin Laie und hab die Seite geerbt und vorher nie etwas mit der Materie zu tun gehabt.
Hallo
und übt bitte Nachsicht, ich bin Laie und hab die Seite geerbt und vorher nie etwas mit der Materie zu tun gehabt.
Von unskannst du jede Menge Nachsicht haben.
Leider sehen HTML, CSS und JavaScript das anders. Ohne ein gewisses Grundwissen geht überhaupt nichts.
Und wir hier im Forum sind damit überfordet dir dieses gesamte Grundwissen beizubringen. Dafür ist der Aufwand schlicht zu hoch.
So gibt es die CSS-Anweisung
float: both;
nicht. Und wenn der Webseitenersteller (in diesem Fall du) sich nur etwas mit float beschäftigt hätte würde im das auch schon die Logik und fast jede Anleitung (links oder rechts ausrichten) sagen.
Auch werden in dem HTML-Teil mehr Container (in deinem Fall div-Elemente) geöffnet als geschlossen.
Ob das JavaScript Fehler enthält weiß ich nicht.
Mit deinen Quellcodeschnipseln investiert jeder einzelne von uns seine private Zeit, baut eine Webseite und sieht - eine weiße Seite ohne Inhalt. Wie sollen wir dir helfen wenn du nicht mal über die grundlegenden Kenntnisse verfügst eine Seite zu erstellen, auf der überhaupt etwas zu sehen ist?
Zumal die Erfahrung zeigt, dass die Fragesteller bei sollen Wissenslücken mit unseren korrekten Antworten häufig nicht mal etwas anfangen können.
Ich befürchte du überschätzt einerseits deine eigenen HTML-/CSS-Fähigkeiten und erwartest zu viel von dem Forum und den Personen, die dir gerne helfen wollen.
Gruss
MrMurphy
Da Dein HTML-Code fehlerbehaftet ist, was die Anzahl der schliessenden -Tags betrifft (9 *
[code=html]
Gültige Angaben sind none, left, right oder inherit; both hingegen gehört zur clear-Eigenschaft, die einen Float beendet.
https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Positionierung/float
https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Positionierung/clear
Da aber die Elemente im Viewport horizontal zentriert werden sollen, und wir keinen Mehraufwand betreiben wollen, um die Float-Umgebung dorthin zu bugsieren, bedienen wir uns einfach display:inline-block, um die
Die Klasse .social-single statten wir mit text-align:center aus, um ihren Inhalt horizontal zu zentrieren, und korrigieren den linken Außenabstand von 30px auf 0, damit die Buttons tatsächlich in der Fenstermitte erscheinen.
.social-single {
margin: 17px 0 0 0;
text-align:center;
}
#likebutton,
#googlebutton {
display:inline-block;
vertical-align:middle;
margin:5px;
}
#copyscapebutton {
margin-left: 0px;
margin-top: 1px;
}Das Ergebnis kann sich sehen lassen
[ATTACH=full]4492[/ATTACH]
Wenn der Code auf einem Server (lokal oder online) ausgeführt wird, bleibt die Seite nicht weiß - siehe mein Chrome-Schnappschuß
Der Grund dafür ist diese Zeile, die den URL ohne das https: -Protokoll definiert:
js.src = "//connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v2.8";Wird das Dokument nicht auf dem Webserver, sondern in der herkömmlichen Systemumgebung geöffnet (die Browser-Adreßzeile beginnt mit file:///C:/Users/…), weiß der Browser mit diesem URL nichts anzufangen, das erforderliche Script kann nicht geladen werden, der Facebook-Button bleibt fern, und die Seite leer auf weißem Hintergrund.
@Spicelab: vielen Dank für die wirklich hilfreiche Darstellung und die Arbeit, die Du dir damit gemacht hast (den anderen, völlig überflüssigen Kommentar des anderen Users lasse ich mal getrost unbeachtet, da er niemandem hilft).
Es sieht jetzt in der Tat schon viel besser aus, aber FB und G+ Button sind noch immer untereinander
[ATTACH=full]4493[/ATTACH]
Darf ich Dich noch einmal bitten, einen Blick über die Zeilen zu werfen und mir zu sagen, was dort noch falsch ist?
Im Voraus schonmal vielen Dank.
[ATTACH=full]4494[/ATTACH]
[ATTACH=full]4495[/ATTACH]
Nichts, denn das ist die Kopie meines gestrigen Quellcodes.
Binde diese CSS-Datei social-single.css zunächst mal in der Webseite ein, denn derzeit existieren darin nur style.css u. slider.css.
OMG…natürlich…
So, jetzt ist´s gut. Noch einmal vielen, vielen Dank!!!