Hilfee! CSS Div Box class? siehe Dateianhang

Webdesign & Technik Software & Hardware
1

Hallo erstmal zusammen!!

Ich würde gern für mich ein telefonbuch mit thumb von der betreffenden person erstellen.mit umrandung.

#adressen {margin:0 auto
border:2px red;
}
nun weiss ich nicht mehr weiter

  1. der rahmen
    im rahmen linke seite das foto mit einem abstand von 10px vom Rahmen rundherum,
    neben dem foto mit etwa 10px abstand der Vorname: Jürgen
    Nachname: von der Lippe
    Straße: Kanzleramt
    Telefon:123456
    email:Hallo@derdiedas.de

Der text soll immer neben dem Bild sein, auch wenn der text schon unterhalb des fotos.
Dieses soll dann mit hilfe von php+mysql ausgegeben werden .

Bsp. 10 Adressen = 10 Rahmen
oder ein Rahmen der sich der anzahl der adressen anpasst also grösser wird mit Trenn linien nach jedem Datensatz.

2

[quote=“papaya”]im rahmen linke seite das foto mit einem abstand von 10px vom Rahmen rundherum,
neben dem foto mit etwa 10px abstand […][/quote]
Bild floaten lassen, entsprechendes Margin vergeben.

Wie meinen?

Für die Darstellung uninteressant, wo die Daten herkommen.

[quote]Bsp. 10 Adressen = 10 Rahmen
oder ein Rahmen der sich der anzahl der adressen anpasst also grösser wird mit Trenn linien nach jedem Datensatz.[/quote]
Entweder 10 Containerelemente jeweils mit einem Rahmen versehen, oder ein Containerelement, welches alle umfasst; Trennlinien dann als Rahmen geeigneter Elemente.

Wenn man sich ein bisschen mit HTML und CSS beschäftigt hat, sollte das eigentlich gar kein Problem sein.
(Die Überschrift klingt allerdings nicht so, als ob du das schon gemacht hättest. Sonst wären da nicht so willkürlich Stichworte aneinandergereiht.)

3

Die Struktur in (X)HTML könnte ungefähr so aussehen:

<div class="Karteikarte">
<div class="Bild"><img src="Person.png" alt="Portrait: NameDerPerson" width="150" height="200"  /></div>
<div class="Text">
<dl>
<dt>Name:</dt><dd>Zufall</dd>
<dt>Vorname:</dt><dd>Rainer</dd>
<dt>etc</dt><dd>usw</dd>
</dl>
</div>
<div class="clear"></div>
</div>

Das CSS könnte dann grob so aussehen:

div.Karteikarte
{
border: thin solid red;
padding: 1ex;
}
div.Karteikarte div.Bild
{
float: left;
width: 150px;
height:200px
}

div.Karteikarte div.clear
{
clear: left
}

div.Karteikarte div.Text
{
padding: 1ex
}

div.Karteikarte dt
{
display: run-in
}
div.Karteikarte dd
{
padding-left: 2ex
}

Alles ungetestet, viel Spaß damit ;o)
(display: run-in oder auch stattdessen compact wird glaube ich
von älteren Programmen schlecht interpretiert, mag sein, daß
man da etwas basteln muß, wenn einem das wichtig ist)

4

Danke an euch alle,
Werde das Skript mal ausprobieren und euch bescheid sagen.

Bin halb in der Praxis ein kompletter Anfänger mit CSS hatte leider den Fehler gemacht mich zu sehr mit HTML zu beschäftigen.
Ich versuche jetzt alles in CSS zu Designen.

Nicht ganz einfach mit ADS/ADHS

Danke nochmal.

5

Die meisten Leute, die es trotzdem verwenden, haben sich viel
zu wenig mit (X)HTML beschäftigt, insofern denke ich, ist es kein
Fehler, sich damit zu beschäftigen, wenn man es benutzen will.
Damit zeichnet man ja den eigentlichen Inhalt aus, also was
eigentlich relevant in einem Dokument ist.
CSS beschäftigt sich nur mit Dekoration, ist also nicht so wichtig
und kann man gegebenenfalls auch komplett weglassen, weil die
browser ohnehin eine eigene Stilvorlage für (X)HTML haben, um
sinnvoll strukturierten Inhalt automatisch passabel darzustellen.
Anders als bei beliebigem XML braucht man da als Autor nicht
unbedingt eine eigene Stilvorlage beizusteuern.