zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Img & Text, umfließen und responsive

Antwort
 
LinkBack Themen-Optionen Ansicht
  #11 (permalink)  
Alt 26.03.2015, 08:41
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 24.06.2010
Beiträge: 530
K.Roland wird schon bald berühmt werden
Standard

Zitat:
Zitat von Uwe_B Beitrag anzeigen
Also genau genommen sieht es so aus:
O.K. Ich habe es mir angeschaut.

Ist in Ordnung. Hat sich von meiner Seite erledigt.

Zitat:
Zitat von Uwe_B Beitrag anzeigen
PS: Ich weiß leider nicht wie man das Tool von deinem Link benutzt..
Das dient nur zur Anschauung du kannst es aber auch Groß und Klein schieben.

______________
MfG Roland

Geändert von K.Roland (26.03.2015 um 08:59 Uhr)
Mit Zitat antworten
Sponsored Links
  #12 (permalink)  
Alt 26.03.2015, 11:11
Benutzerbild von Manfred62
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.141
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

kann man das nicht so lösen?
einfache Demo:
HTML-Code:
<!DOCTYPE html>
<html lang="de">
<head>
	<meta charset="UTF-8">
	<title>Test</title>
	<style>
	* {
		margin: 0;
		padding: 0;
	}
	body {
		font: 100%/1.5 sans-serif;
		padding: 1em;
	}
	figure {
		border: 1px solid #cdc0b0; 
		border-radius: 4px; 
		padding: 10px; 
		margin-bottom: 15px;
	}
	img {
		float: left; 
		margin-right: 10px;
	}
	.cf:after {
		content: " ";
		display: table;
		clear: both;
	}
	@media only screen and (max-width: 450px) {
		figure {
			text-align: center;
		}
		img {
			float: none;
			margin: 0;
			/*width: 100%;*/
		}
		figcaption {
			float: left;
			text-align: left;
		}
	}
	</style>
</head>
<body>
	<figure class="cf">
		<img src="http://placehold.it/200x150/0eafff/ffffff.png" alt=""/>
		<figcaption>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit repudiandae magni deserunt amet accusamus fuga minus quo, ullam, quia alias, hic earum? Rerum sint maiores quisquam ullam illum non autem. Nisi adipisci provident incidunt unde ipsa consectetur laudantium natus repellat ut, optio fuga suscipit vitae expedita fugiat, praesentium porro ab quibusdam itaque placeat quos tempore harum, obcaecati deserunt!</figcaption>
	</figure>
</body>
</html>
Mit Zitat antworten
Sponsored Links
  #13 (permalink)  
Alt 26.03.2015, 16:04
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 24.06.2010
Beiträge: 530
K.Roland wird schon bald berühmt werden
Standard

Zitat:
Zitat von Manfred62 Beitrag anzeigen
kann man das nicht so lösen?
Hallo Manfred62

So wie du zeigst, wollte er es am anfang.
So hatte ich es auch verstanden.

Ich denke es soll auch ohne Media Queries funktionieren.

Er hat es nun wieder so mit overflow: auto; und min-width: 200px; gelöst.

Damit es sich unter dem Bild platziert wen erst die Mindestweite erreicht ist.

___________
MfG Roland
Mit Zitat antworten
  #14 (permalink)  
Alt 31.03.2015, 17:59
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.11.2006
Beiträge: 36
Uwe_B befindet sich auf einem aufstrebenden Ast
Standard Danke!

Danke für die Anregungen, ich werde dann wohl mit @media arbeiten.
Mit Zitat antworten
Antwort

Stichwörter
float, img, responsive, text

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Wrapper wächst nicht mit, keine Floats maclady CSS 11 10.02.2010 18:30
Wachsende Container Andy CD CSS 13 10.02.2010 14:08
DIV bis GANZ unten burnZ CSS 5 27.07.2008 14:14
Helft mir. Ich habe voll die Leseschwäche nick CSS 12 15.01.2008 21:52
Problem mit div und Höhe deep4 CSS 2 13.11.2007 21:03


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:12 Uhr.