CSS class überschreiben wenn @media (max-width : 480px)

...komplette Frage anzeigen

5 Antworten

Die Bilder, die ueber dem Hintergrund liegen, haben doch schon die Klasse .portal. Im Mediaquery unter @max-width...schreibst du einfach .portal { width=...% } 

Eigentlih haettest du den Text, der auf den tuerkisen Hintergrund liegt und veilleicht auch den Titel) auch mit Webfonts und Hintergrund realisieren koennen, aber ist auch egal.

du kannst es sicherlich mit Mediaqueries probieren (das mit @media), alternativ kannst du auch bei deinen Bildern die width auf 100% setzen, und dann gibts noch sowas  wie max-width, also das die maximale breite des elements bestimmt, und min-width, welches die minimale Breite bestimmt. Aber für ein komplett responsive Design, wirst du leider um Mediaqueries nicht drum rum kommen. Aber Gott sei dank gibts da einen Haufen Tutorials im Web :D

Stichworte zum Suchen: Media Queries und IRT (image replacement techniques). So sparst du unnötige HTTP-Request. Zudem kann deiner Website auf mobilen Geräten schneller geladen werden. 

https://css-tricks.com/css-image-replacement/

LG aus der Nachbarschaft, medmonk ;-)

wenn die Elemente für Nebeneinander zu klein sind sag den img-Tags einfach bei der gewollten Bruchstelle

display:block; 

width:100%;

height:auto;

dann rutschen die Bilder untereinander un haben ab deinem Breakpoint 100% Breite und sind untereinander

die Seite kommt auf einem Handy nicht gut rüber.

Vor allem die Bilder aus Deinem Portfolio

Zudem dein Footer ist nicht verwendbar (links dort auf der RECHTEN Seite)

Da die Seite ja fast keinen Inhalt hat kannst Du noch was neues Probieren.

Ich empfehle Dir

http://getbootstrap.com/

Was möchtest Du wissen?