Text verschieben

Hallo Leute, Ich bekomme es nicht hin den Text an die markierten Stellen zu verschieben ohne neue "graue Boxen" zu erstellen.

Der hier verwendete Code

<!DOCTYPE HTML> <html> <head> <link href='https://fonts.googleapis.com/css?family=Poiret+One|Varela+Round' rel='stylesheet' type='text/css'> <meta charset="utf-8"> <style> * { margin: 0; padding: 0; } main , header , footer { width:100%; margin:0px auto; padding:10px; font-family: 'Poiret One'; line-height:20px; letter-spacing:1px; box-sizing:border-box; } main { background:white; display:flex; } .links,.rechts{ background:white; color: Black; display:flex; flex:1; padding: 1em; font-weight: bold; text-align: center; } main{ display:flex; } #mywrapper p { padding: 10px; } footer{ padding: 10px; background: transparent; text-align: right; color: black;} #mywrapper h1 { background:orange; padding: 15px; font-family: 'Poiret One'; text-align:center; } .ll,.rr{ flex:1; padding:10px; background: lightgrey; } img{ flex:1; width: 100%; border: 0px solid lightgrey; } .ll p,.ll h2{ margin-bottom:20px; } </style> </head> <body> <div id="mywrapper"> <header> <h1>Frisch eingetroffen!</h1> </header> <main> <div class="links"> <div class="ll"> <h2>Artikel 1</h2><p>Texte die man rein schreiben kannn</p></div> <div class="rr"> <a href="#"><img alt="" src="https://javascript-forum.de/images/Hauptbild-mit-Rand.jpg" width="20%"></a> </div> </div> <div class="rechts"> <div class="ll"> <h2>Artikel 2<h2><p> text text text text text text text text text text</p> <p>Hallo, ich bin ein Text der Grösse 5</p> </div> <div class="rr"> <a href="#"><img alt="" src="https://javascript-forum.de/images/Hauptbild-mit-Rand.jpg" width="20%"></a> </div> </div> </main> <footer> Fotter </footer> </body> </html>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!