Beiträge von brainstuff

Hallo,

Ich habe eine Seite, die im landscape Modus auf dem Smartphone nur bis zur Mitte angezeigt wird. Wo kann man die Seitenhöhe einstellen?

Danke,

brainstuff

Hallo,

Ich habe die Seite jetzt in 3 Teile aufgeteilt:

1 das Menu

2. die Slideshow

3. die Anzeige von der Slideshow position

Diese 3 Teile funktionieren sehr gut individuell und auch zusammen.

Ich kann die vertikale Reihenfolge und den Platz problemlos festlegen.

Aber die Grösse der Elemente ist nur schwer zu beeinflussen.... Besonders die von den Slides.

Deshalb würde ich die 3 Elemente gerne in "grids" (oder "inline frames") stellen, deren Grösse ich in der Smartphone Version reduzieren kann. Einfach 3 Grids übereinander in denen die Elemente angezeigt werden.

Wie geht das?

Danke.

brainstuff

Basti1012,

Auf http://mail2vip.com/test/screen siehst du die Version die ich jetzt habe. Das ist die Version für normale Bildschirme und die ist fast in Ordnung. Da muss ich nur das Bild etwas weiter runter legen und das Menü an den richtigen Ort legen ... aber das ist kein Problem.

Ich plane eigentlich die Version für Smartphones in ein eigenes Verzeichnis zu legen vas angezeigt wird, wenn die Seite von einem phone aufgerufen wird.

Wenn ich die Seite für normale Bildschirme auf dem Smartphone Aufrufe, dann kommt schon in der Mitte vom screen. Aber zu klein. Wenn ich die Bilder-show in der smartphone version so vergrösserte, dass sie (im portrait Format) von Rand zu Rand reicht, wird das im Landscape Modus zu gross.

Deshalb habe ich mir gedacht, dass ich die bildershow für die Smartphone Version einfach in 5 "inline frames" lege und die Reihenfolge der Bilder in den einzelnen frames so andere, dass immer 5 verschiedene Bilder angezeigt werden, wenn die orginalgrösse angezeigt wird. Wenn der Nutzer dann das Bild vergrössert sieht er nur noch eine von den 5 slideshows. Die kann er dann auch im landscape Modus auf die passende Grösse ziehen.

Mit den inline frames wüfde das eigentlich ganz einfach gehen. Da könnte man die aktuelle Seite einfach 5x abspeichern (mit jeweils anderer Reihenfolge der Slides) und dann kann man jede Slide show in einen inline-frame legen. Dann ist das wie ein Hochhaus mit 5 Etagen.

..... HHH.....

..... HHH.....

..... HHH.....

..... HHH.....

..... HHH.....

Da dann jede Etage alle Bilder zeitversetzt anzeigt, kann der Nutzer dann ein beliebiges Fenster grösser ziehen.

Eigentlich müsste es in CSS möglich sein, dass man die grosse von den Containern in denen die Slideshows angezeigt werden beliebig gross machen kann. Das wåre dann idéal, weil man dann diese slideshows komplett mit allem darum und dran vergrössern /verkleinern kann (wie ein Bild).

Für die Erkennung der benötigten Version habe ich ein .Htaccess script gefunden was ermittelt ob der Nutzer ein Smartphone verwendet. Das testé ich zur Zeit. Aber wenn Du eine bessere idee hast, ist das auch eine gute Sache.

Danke dass du mir hilfst.

brainstuff

Basti.

Danke dass Du deinen Schlaf raubst... Du verdienst einen Orden!

Ich bin dabei eine Seite zu machen die eigentlich extrem einfach ist: es sind 5 Bilder die in einer Endlosschleife angezeigt werden. Es hat am oberen Bildrand noch ein Menü was beim Mouse over auf klappt und wenn man auf das letzte Bild clickt wird das Bild mit einer Kontakt-Seite überdeckt. Bis auf die Kontakt Seite läuft das jetzt auf einem normalen Bildschirm.

Aber ich muss unbedingt daraus auch eine Version für Smartphones hinbringen.

Auf Smartphones kommt das Bild aber zu klein, weil es ziemlich breit ist. Im Portrait Modus ist das Bild zu klein, wenn es in der ganzen Breite angezeigt wird. Im Landscape Modus, ist das Bild dann zu hoch. Es scheint auch, dass die Seite nicht zuverlässig immer in der gleichen Grösse auf allen Smartphones angezeigt wird.

Ich überlege deshalb, ob ich da nicht eine spezielle Seite für den responsive Modus mache, die die slide Seite einfach in 5 "inline frames" wiederholt (die oberste slideshow beginnt bei bild1, die 2. bei Bild 2, usw. ) das führt dann dazu, dass auf einem Smartphone alle 5 Bilder zu sehen sind, wenn man die Seite lädt. Wenn der Besucher dann einen frame vergrössert hat er eine bildershow auf dem screen. Das könnte ganz toll aussehen.

Auf mail2vip.com/test/screen/ läuft meine test Seite... Auf einem computer screen ist das menu am richtigen Platz (aber es ist noch nicht fertig). Auf meinem phone kommt das auch schon ganz ordentlich, aber zu klein (auch das Menü ist da an einem falschen Platz.. Aber das ist ein detail). Das was du da siehst will ich einfach 5x untereinander wiederholen... Wenn man dann die Seite öffnet hat es die 5 Bilder auf dem screen, wenn man eines davon grösser zieht, hat man die Bilder als bildershow.

Danke für Deine Hilfe,

brainstuff

Ich habe eine slideshow, die gut arbeitet. Die Datei hat den Namen slides1.Html. Ich will die jetzt multiplizieren (= slides1.html, slides2.html,.....) .. In den Kopien ändere ich dann die Bilder. Dann mache ich mir eine Index-Seite in der hintereinander die slides1.html... slides?.html angezeigt werden sollen. Das konnte man früher mit 'inline Frames' machen. Kann man das auch mit css machen?

Am liebsten hätte ich gerne eine Index.html Seite in der ich die grösse

von den angezeigten Seiten dann einstellen kann...

Schematisch sieht das dann so aus:

___

1

___

2

___

3

___

Wie geht das?

Danke,

brainstuff

Hi djheke,

Danke für dieses script... das ist ganz prima.

Es läuft jetzt schon ganz toll, ich muss nur noch die Bildgrösse anpassen (das geht auch ganz einfach... das ist ganz toll in dem script erklärt).

Ich habe auch herausgefunden, wie man das Bild (für die mobile Seite) weiter oben platzieren kann.

Ich habe aber nocn nicht begriffen, wie man die Slides (für die mobile Version) linksbündig, mit einen 5px Rand, anordnen kann.

Wenn Du zufällig weisst wie das geht, erspart mir das das probieren.

Danke euch allen, ihr habt mir sehr geholfen.

brainstuff

Hallo Sempervivum,

Ich habe jetzt ein anderes Script gefunden, was einfacher ist, aber was auch auf 3 Bilder geschränkt ist.

Ich habe Dir das auf

http://mail2vip.com/test/

gelegt ... da kannst Du sehen, dass das ordentlich funktioniert ... aber nur für 3 Bilder . Du findest auch im Nachfolgenden das CSS und das HTML ...

Ich muss nur noch wissen wie ich da zwei weitere Bilder dranhängen kann und wie ich die in die Mitte von der normalen WEB Seite stellen kann und wie ich sie auf der Smartphone Seite vertikal in die Mitte platzieren kann und horizontal mit einem kleinen Rand auf beiden Seiten.

brainstuff

<!DOCTYPE html>

<html><head>

<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>form1test</title>

<link rel="stylesheet" type="text/css" href="css/form4.css">

</head>

<body

style="background-color: rgb(165,68,154);">

<h1>BildwechslerCSS</h1>

<main>

<h2>XXXXXXXX</h2>

<figure id="gallery">

<figure> <img src="images/dan01.jpg" alt="1">

<figcaption>1</figcaption>

</figure>

<figure> <img src="images/dan02.jpg" alt="2">

<figcaption>2</figcaption>

</figure>

<figure> <img src="images/dan03.jpg" alt="3">

<figcaption>3</figcaption>

</figure>

<figcaption>zzzzzzzzz</figcaption>

</figure>

</main>

</body>

</html>

Css

_________________

main {

background: transparent;

border-color: transparent;

}

#gallery {

position: relative;

margin: 0;

background: none;

border: none;

}

#gallery figure {

position: absolute;

display: inline-block;

top: 0;

left: 2em;

z-index: 1;

animation: wechseln 15s infinite;

}

#gallery figure:last-of-type {

position: relative;

}

#gallery > figure figcaption {

position: absolute;

left: 1em;

font-size: 2em;

font-weight: bold;

bottom: 0.5em;

z-index: 2;

color: white;

}

@keyframes wechseln {

0% {

opacity: 0;

}

20% {

opacity: 1;

}

40% {

opacity: 1;

}

60% {

opacity: 0;

}

100% {

opacity: 0;

}

}

#gallery figure:nth-of-type(2) {

animation-delay: 5s;

opacity: 0;

}

#gallery figure:nth-of-type(3) {

animation-delay: 10s;

opacity: 0;

}

#gallery figure:nth-of-type(4) {

animation-delay: 10s;

opacity: 0;

}

#gallery figure:nth-of-type(5) {

animation-delay: 10s;

opacity: 0;

}

Hallo Supervivum,

Ich habe das mit Deinem Script versucht, aber das geht nicht. Kann es sein, dass das nicht gehen will, weil das CSS für den Rest in einem *.css File ist? Das Scrppt im HTML verändert nichts.

brainstuff

Danke für eure Kommentare,

Das Ding ist eigentlich ganz einfach: Die Seite ist eine Slide show aus 5 Bildern .. beim Seitenaufruf wird Bild 1 angezeigt, nach x Sekunden wird es durch Bild 2 ersetzt, dann durch BIld 3 .... Bild 5 wird dann wieder durch Bild 1 ersetzt und das läuft so lange im Kreis, bis jemand auf das noch hinzuzufügende Menu klickt oder auf einen Link der unter der Bilder Serie eingeblendet wird

Also :

MENU = ein Ikon mit den 3 Strichen, was wenn man drauf klickt eine Menu auswahl aufklappt.

---------------------

BILDERSERIE (die 5 Bilder abwechselnt und in einer Endlosschleife

---------------------

link zu einer Kontakt Seite

Die Bilder müssen in der Mitte der Seite zentriert erscheinen.

Also so

_______________________


.........BILDER

_______________________

Es gibt dann noch eine 2. Version von der Seite für Smartphones ... da wird die Bilderserie nur vertuikal zentriert.

Also so:

___________________________

..OOBILDEROO

____________________________

Links hat es dabei nur einen schmalen Rand. Das Bild ist wieder in der entsprechenden Grösse, in der vertikalen Mitte vom Smartphone Bildschirm. Das alles ohne irgendwelche effekte (kein fading, kein reinschieben,..) einfach ein bild nach dem anderen in einer Endlosschleife.

Das Script was ich da gefunden habe, geht sehr gut mit 3 Bildern ... aber sobald ich da ein weiteres Bild (bzw 2 weitere Bilder) hinzufüge, geht das nicht mehr.

Danke für eure Hilfe, ich brauche das sehr dringend und schaffe das einfach nicht ohne eure Hilfe.

brainstuff

Hallo Nackththund94,

Danke für das was du da sagst... das scheint mir auch logisch zu sein und das habe ich auch schon versucht, aber das ist nicht genug.

Ich vermute. dass ich auch noch etwas bei den "keyframes" ändern muss.

Ich begreife auch nicht, warum es in dem html 6x <figure> für 3 Bilder hat.

Ich habe auch verzweifelt nach dem Platz gesucht wo ich mit top und left einstellen kann wo das Bild platziert werden soll.

Danke,

brainstuff

Hallo,

Ich finde einfahc nicht heraus wie man die folgene CSS Bildergalerie um zwei weitere Bilder erweitern kann:

CSS

main {

background: transparent;

border-color: transparent;

}

#gallery {

position: relative;

background: none;

border: none;

}

#gallery figure {

position: absolute;

top: 0;

left: 0;

}

#gallery figcaption {

position: absolute;

left: 1em;

font-size: 2em;

font-weight: bold;

bottom: 0.5em;

color: white;

}

@-webkit-keyframes bilder {

0% {

opacity: 1;

}

34% {

opacity: 1;

}

35% {

opacity: 0;

}

100% {

opacity: 0;

}

}

@keyframes bilder {

0% {

opacity: 1;

}

34% {

opacity: 1;

}

35% {

opacity: 0;

}

100% {

opacity: 0;

}

}

#gallery figure:nth-of-type(1) {

-webkit-animation: bilder 15s 7s infinite;

animation: bilder 15s 7s infinite;

}

#gallery figure:nth-of-type(2) {

-webkit-animation: bilder 15s 2s infinite;

animation: bilder 15s 2s infinite;

}

#gallery figure:nth-of-type(3) {

-webkit-animation: bilder 15s 12s infinite;

animation: bilder 15s 12s infinite;

}

@-webkit-keyframes wechseln {

0% {

opacity: 1;

transform: scale(1, 1);

z-index: 20;

}

20% {

opacity: 1;

transform: scale(1, 1);

}

34% {

opacity: 0;

transform: scale(0, 0);

}

100% {

opacity: 1;

transform: scale(0, 0);

}

}

@keyframes wechseln {

0% {

opacity: 1;

transform: scale(1, 1);

z-index: 20;

}

20% {

opacity: 1;

transform: scale(1, 1);

}

34% {

opacity: 0;

transform: scale(0, 0);

}

100% {

opacity: 1;

transform: scale(0, 0);

}

}

#gallery figure:nth-of-type(4) {

-webkit-animation: wechseln 15s 10s infinite;

animation: wechseln 15s 10s infinite;

}

#gallery figure:nth-of-type(5) {

-webkit-animation: wechseln 15s 5s infinite;

animation: wechseln 15s 5s infinite;

}

#gallery figure:nth-of-type(6) {

-webkit-animation: wechseln 15s infinite;

animation: wechseln 15s infinite;

}

HTML

___________

<!DOCTYPE html>

<html><head>

<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>form1test</title>

<link rel="stylesheet" type="text/css" href="css/form1.css">

</head>

<body

style="background-color: rgb(165,68,154);"

<main>

<h2>xxxxxx</h2>

<div id="gallery">

<figure> <img src="images/dan03.jpg" alt="33333">

<figcaption>333</figcaption>

</figure>

<figure> <img src="images/dan02.jpg" alt="22222">

<figcaption>222

</figcaption>

</figure>

<figure> <img src=""images/dan01.jpg" alt="1111">

<figcaption>

</figcaption>

</figure>

<figure> <img src="images/dan03.jpg" alt="33333">

<figcaption>333

</figcaption>

</figure>

<figure> <img src="images/dan02.jpg" alt="22222">

<figcaption>222

</figcaption>

</figure>

<figure> <img src="images/dan01.jpg" alt="1111">

<figcaption>111

</figcaption>

</figure>

</div>

</main>

</body>

</html>

---------------------------------

Kann mir bitte jemand sagen, wie ich diese Bildergalerie um weitere Bilder erweitern kann?

Danke

brainstuff

Ich habe einen scheinbar ganz tollen Formular-Generator gefunden und mir ein Kontakt-Formular generiert, was fast perfekt ist ... nur es kann das schöne Formular bzw. dessen Inhalt nicht verschicken. Die Leute die die Seite gestaltet haben, haben schlichtweg vergessen, dass der Submit Button eine Mailadresse braucht wohin der Formular Inhalt geschickt wird.

Folgender Code schickt das Formular ab:

<li class="buttons">

<input type="hidden" name="form_id" value="15645" />

<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit" />

</li>

Komischerweise ist das Formular angeblich PHP basiert aber es hat nirgendwo etwas was PHP betrifft und das Java-Script ist unleserlich.

Wo muss ich die Email-Adresse hinschreiben wohin das Formular geschickt werden muss.

Mir scheint, dass das auch mit nur CSS möglich sein könnte ... kann mir bitte jemand sagen, ob das gehen könnte?

Ich will eine ganz neue Idee umsetzen ... ich will ein Support-Formular schaffen, womit der Nutzer eine kurze Frage stellt (er gibt nur seinen Namen, seine Email und die Frage in das Formular ein). Wenn er auf absenden klickt, bekommt der Nutzer eine Mail vom "Support" in der er gebeten wird seine Frage zu stellen, gleichzeitig bekommt der "Support" eine Mail in der steht wer anfragt (das ist im Grunde genommen die alte Idee vom Verlangen von einer RMA Nummer fürs einsenden von kaputten Geräten) ... mit meiner Idee kann ich die Fehler von Formularen beseitigen. Der Nutzer verlangt per Formular eine Ticket Nummer und kann dann auf das Mail, was er bekommt antworten.

Danke,

brainstuff

Hallo,

Ich habe ein "Accordeon" aus verschiedenen Quellen zusammengebastelt. Das läuft eigentlich ganz brauchbar, aber ich bringe es nicht hin dass es möglich ist, die aufgemachten Texte wieder zu schliessen, ohne dass man einen anderen Text aufklappen muss.

Hier der Code:

<!DOCTYPE html>
<html class="no-js" lang="en"><head>
<head>
<title>Accordeon</title>

</head>
<style type="text/css">

body {
  color: #2c3e50;
  background: transparent;
}
h1 {
  text-align: center;
}
.half {
  float: left;
  width: 50%;
  padding: 0 1em;
}
/* Acordeon styles */
.tab {
  position: relative;
  margin-bottom: 1px;
  width: 100%;
  color: #fff;
  overflow: hidden;
}
input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
label {
  position: relative;
  display: block;
  padding: 0 0 0 1em;
  background: #16a085;
  font-weight: bold;
  line-height: 3;
  cursor: pointer;
}
.blue label {
  background: #2980b9;
}
.tab-content {
  max-height: 0;
  overflow: hidden;
  background: #1abc9c;
  -webkit-transition: max-height .35s;
  -o-transition: max-height .35s;
  transition: max-height .35s;
}
.blue .tab-content {
  background: red;
}
.tab-content p {
  margin: 1em;
}
/* :checked */
input:checked ~ .tab-content {
  max-height: 10em;
}
/* Icon */
label::after {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 3em;
  height: 3em;
  line-height: 3;
  text-align: center;
  -webkit-transition: all .35s;
  -o-transition: all .35s;
  transition: all .35s;
}
input[type=checkbox] + label::after {
  content: "+";
}
input[type=radio] + label::after {
  content: "\25BC";
}
input[type=checkbox]:checked + label::after {
  transform: rotate(315deg);
}
input[type=radio]:checked + label::after {
  transform: rotateX(180deg);
}

</style>


<body>
<div class="wrapper">
  
  <div class="half">
    
    <div class="tab blue">
      <input id="tab-four" type="radio" name="tabs2">
      <label for="tab-four">xxxx1</label>
      <div class="tab-content">
       <p>dies ist der aufgeklappte Text</p>
      </div>
    </div>
    <div class="tab blue">
      <input id="tab-five" type="radio" name="tabs2">
      <label for="tab-five">xxxx2</label>
      <div class="tab-content">
        <p>dies ist der aufgeklappte Text</p>
      </div>
    </div>
    <div class="tab blue">
      <input id="tab-six" type="radio" name="tabs2">
      <label for="tab-six">xxxx3</label>
      <div class="tab-content">
        <p>dies ist der aufgeklappte Text</p>     </div>
       </div>
    
    </div>
  </div>
</div>

</body>
</html>

Und dann hätte ich noch gerne, dass der Strich zwischen den eInzelnen Texten dicker und transparent (damit der Hintergrund durchscheint) ist . Aber ich finde nicht raus was den Strich erzeugt.

Danke,

brainstuff

Danke Arne ... das war der Fehler.

Hallo,

Ich versuche einen Style durch einen etwas komplexeren Style zu ersetzen. Es handelt sich um ein Logo was an einem festen Punkt von der Seite plaziert wird. Im Hintergrund hat es eine slide show.

Wenn der Style

#logo01 {

position: fixed;

color: black;

background-color: black;

width: 280px;

height: 70px;

top: 30px;

left: 30px;

}

mit dem html code:

<div id="logo01"><img style="width: 287px; height: 71px;" alt="logo" src="images/logo01.jpg"><br>

</div>

verwendet wird kommt das Logo ganz normal und bleibt auch angezeigt, wenn der Seitenhintergrund ändert (wegen der Slide-Show)

Mein neuer Style ist dieser:

.logo02 {

position: fixed;

width: 280px;

height: 70px;

top: 30px;

left: 70px;

}

.image {

display: block;

width: 50%;

height: auto;

}

.overlay {

position: fixed;

top: 30px;

left: 30px;

opacity: 0;

transition: .5s ease;

background-color: transparent;

}

.logo02:hover .overlay {

opacity: 1;

}

.text {

color: white;

font-size: 10px;

background-color: blue;

position: fixed;

top: 120px;

left: 150px;

transform: translate(-50%, -50%);

-ms-transform: translate(-50%, -50%);

text-align: center;

}

Das wird mit

<div id="logo02"><img style="width: 287px; height: 71px;" alt="logo" src="images/logo01.jpg"><br>

</div>

aufgerufen.

Aber das Logo wird dann nicht fest angezeigt sondern verschwindet jedesmal wenn der Background ändert.

Ich glaube, dass das daran liegt, dass beim neuen Style der Style-Name mit einem Punkt (.logo02) und nicht mit # (#logo01) anfängt und mein Html gar nicht diesen Style aufruft.

Wie muss das richtig heissen?

Danke,

brainstuf

Basti1012 Danke, das ist ein ganz toller Ansatz ... und Du hilfst mir damit sehr weiter. Es zeigt mir, dass meine Idee machbar ist und ich kann jetzt ausprobieren, ob das praxistauglich ist.

Danke,

brainstuff

Ich habe da eine Idee und habe versucht ob ich die zusammenbringe ... aber es geht irgendwie nicht. Kann bitte jemand überlegen, ob das was ich da machen will gehen könnte?

Und zwar will ich einen Datei Pfad in einen Kasten schreiben und den par mouse over anklicken ... aber nicht nur komplett sondern in Teilen ... und zwar soll der Pfad komplett im Kasten stehen ... also Home/XXXX/zzzz/index.dat mit z-index will ich den kompletten Namen so überschreiben, dass er sich bei mouse over "verkürzt" und dass dann ein verkürzter Link angeklicht wird .... Der komplette Pfad ist der Pfad zu der Seite auf der man ist .. also: http://xyz.com/XXXX/zzzz/index.html (bei dieser Anzeige braucht eigentlich nichts passieren, weil das die Seite ist die angezeigt ist ...es hat also keinen Link auf index.html wenn man aber mit der Maus weiter nach links fährt verändert sich die Anzeige automatisch .. http://xyz.com/XXXX/zzzz/ ..... http://xyz.com/XXXX/ wenn man dann auf xxxx klickt wird die Seite geöffnet, die in http://xyz.com/XXXX/ liegt ... wenn man noch weiter nach links geht kommt nur noch http://xyz.com/ und der Link der dann aufgeht ist die Hauptseite ...

Eine Variante wäre es dass der Pfad komplett angezeigt wird (http://xyz.com/XXXX/zzzz/index.html) und dass beim Mouse over die nächst höheren Ordner "rot" werden ... http://xyz.com/XXXX/zzzz/ ..http://xyz.com/XXXX/zzzz/ und wenn man dann auf die roten Wörter klickt wird die dazu gehörige Seite geöffnet.

Danke,

Brainstuff

@m.scatello Ich habe irgendwo einmal gelesen, dass diese Mode mit dem Inhalt in der Mitte (breite ungenützte Ränder) aufgekommen ist, weil einige Leute, die Darstellung auf Smartphones "verbessern" wollten ... Schmalere Texte gelten zudem als lesbarer.

Ich habe ausprobiert, was passiert, wenn man den Inhalt nicht in der Seitenmitte plaziert sondern links angeschlagen (aber auch mit reduzierter Breite) ... das ist eindeutig praktischer .... man kann dann unwesendliches in den rechten Rand legen ... da wird dann die Seite auch auf einem Smartphone leserlicher (wenn man keine Extra-Seite für Smartphones schafft).

Danke,

brainstuff

Ich bin inzwischen zu der Auffassung gelangt, dass die Mode mit dem "in der Mitte platzieren" total sinnlos ist.

Ich habe mir eingebildet, dass die Seiten mit einer "Hochkannt-Seite" in der Seitenmitte auf Smartphones etwas "besser" kommen ... aber auch dort sind die zu nichts zu gebrauchen.

Es ist viel besser, alles, konventionell links aufzubauen. Wenn es darum geht Text Kästen schmal und lesbar zu erhalten, kann man denen ihre Breite auch links auf der Seite begrenzen.

MrMurphy auf der Testseite ist das zu sehen was es mir hier ohne das "NAV" anzeigt: die Wrappers sind in der Seitenmitte.

Ich will die aber am linken Rand haben. Ich glaube das macht mehr Sinn, wie die Mode, das in die Seitenmitte zu stellen.

Ich ändere jetzt mal das mit dem Justify-content und versuche die Fehler rauszuschmeissen, die die Validierung da zeigt.

Dann lege ich die Seite auf eine Test-Adresse die ich DIr dann hier gebe ... dann siehst Du das Ergebnis ...

Danke,

brainstuff

PS ich habe jetzt justify content und NAV rausgeschmissen danach war dann der wrapper zu wit oben ich habe desshalb noch margin-top: 100px; dazugefügt, jetzt läuft es gut ich stelle Dir das jetzt auf http://mail2vip.com/vtc/test01…nacheinander_links_2.html