[Invision]  Forumname & Beschreibung versetzen

Hallo,

ich bin gerade dabei mir mein zweites Forum einzurichten.
Jetzt will ich wie hier auch, Bilder vor den Forennamen setzen.
Mir ist das mit dem Bild und der Schrift aber etwas zu aeinander geklatscht.
Wie bekomme ich die beiden Schriften und Bild etwas auseinander?



LG

Christian

Lieber Christian,

Findest du nicht, das es mal Zeit wird sich mit Firebug und CSS auseinander zu setzen?
Seit Tagen fragst du hier immer wieder nach solchen Lösungen die du mit CSS in zwei Minuten selber finden könntest.
Eine andere Lösung wäre das du den Transparenten Rand deiner Grafik etwas verbreiterst.

Ja Frank, das weiss ich.Wenn ich Zeit habe werde ich mich damit auch mal beschäftigen, dass hatte ich mir auch schon Vorgenommen.
Hab mir mal Firebug drauf gemacht, ich weiss nur nicht welche Stelle das sein soll wo ich das oben genannte Problem ändern kann.

Kannst du bitte dein neues Forum als Forum 2 in dein Profil einsetzen? Danke.
Ich werde nun mal an meinen Rechner gehen und dann versuche ich dir mal an diesem Beispiel zu erklären, wie man mit Firebug umgeht.
Mit etwas Übung wirst du dann ganz leicht die richtigen Codes finden und in dein CSS einsetzen können.

Hab das 2. Forum nun drin, sorry hatte es vergessen einzutragen.

Das wäre nett Frank, wenn Du mir mal ein Beispiel zeigen würdest.

Danke

Gut, ich versuche es mal einigermaßen verständlich zu erklären.
Du klickst mit der rechten Maustaste auf deine Grafik und wählst dann "Element mit Firebug untersuchen" an.
Nun öffnet sich im unteren Teil ein Fenster. das sieht dann so aus:


Hier siehst du nun, das deine Beschreibung in der Class ".forum-desc" als ein "img" Element vorhanden ist.
Diese Class hat aber nun noch keinen Zuweisung, so das wir uns den CSS Eintrag erst einmal generieren müssen.
nun eine Besonderheit:
Du markierst mit einem Klick auf das "p" diese Class.

Danach gehst du mit der Maus in das rechte Fenster und machst in dem Freien Bereich einen Rechtsklick und wählst "Regel hinzufügen".

Dann siehst du das dies Class hinzugefügt wird.
Dann müssen wir diesen Eintrag noch erweitern, da wir ja nur das Bild ansprechen wollen.
Dazu erweitern wir das so:

Wenn du das gemacht hast, dann siehst du schon im Forum, wie sich das auswirkt:

Je höher du den Wert bei margin-right wählst, um so weiter wird der Text nach rechts Verschoben:


Damit weißt du nun, was du in deinem CSS eintragen musst:

Code:

.forum-desc img {
    margin-right: 10px;
}

Schon hast du dein Ergebnis.
Im Netz gibt es einige Seiten die dir die Funktionen von Firebug näher erklären und auch an Beispielen Zeigen, was man wie machen kann.
Wie die Befehle Lauten kann man sich auf CSS4you oder Selfhtml aneignen.
Firebug unterstützt dich dabei auch mit einer Vorschlagsfunktion um die Befehle zu editieren.
Wenn man etwas Übung damit hat und versteht, wie das alles zusammen hängt und wie es Funktioniert, dann lassen sich damit recht einfach alle möglichen Ergebnisse Offline Testen um dann die Richtigen Codes zu generieren um sie dann im Forum einzufügen.

Ich hoffe du kannst anhand dieses Beispiels nachvollziehen, wie ich das nun in diesem Fall raus bekommen habe und dann den entsprechenden Code erstellt habe.

Du kannst mir glauben, das auch Günther in allen deinen Fragen der letzten Tage genau so vorgegangen ist.
Wenn man etwas Übung mit dem Tool hat, dann sind auch komplexere Anpassungen kein Problem mehr.

Ok vielen lieben dank Frank, ich versuch mich mal daran.


Danke für deine Mühe

Dann schließe ich hier vorerst mal.
Solltest du noch Probleme damit haben, sende eine PN an Günther, da ich heute Nachmittag nicht online sein kann.