Responsives Webdesign auf max 1280 begrenzen.

[bercam]

Hallo
als Eigentherapie um nicht weiter meine schwere Krebserkrankung zu denken, Chancen stehen jetzt bei 80 % - 85 % nach 15 OP etc, beschäftige ich mich derzeitig erneut mit der Programmierung .

Ich habe jetzt bei einem kleinen Projekt mittels " @media only screen and (min-width: ...px ) und etc . auch alle Display anzeigen von 176 - 1280 px eingerichtet .

Nun will ich aber vom Design her, alles was größer als 1280 ist auf diese Größe in der Anzeige beschränken. Arbeite selbst mit 1920 er Auflösung.

Ich will, ja ich will aber das max 1280px Design auch bei größeren Displays vorschreiben.

Aber nach 3.5 Jahren Kampf gegen den Krebs fehlt mir sicherlich nur eine Textzeile.
Wer kann da helfen?

 

[_schatzi_]

Hallo!

Hast du einen umschließenden Container?
Dann gib diesem z.B. folgendes mit:

#wrapper{
    width:100%;
    max-width:1280px;
}

 

[bercam]

Das hatte ich vorher vergessen anzugeben.

Mein umschließender Container sieht so aus:

.allContainer {
margin-left: auto;
margin-right: auto;
max-width: 1280px;
width: 100%;
}

Da ich mehr als eine externe CSS habe, hatte ich vergessen aus zweien die Media angaben zu löschen. Nun habe ich endlich ein Lächeln im Gesicht.

Danke für die Hilfe, soll ich die Angaben so stehen lassen?

Gruß und Danke

 

[_schatzi_]

Hallo!

Dann gib uns doch bitte einen Link zu der Seite! Mehr als Raterei ist mit diesen Informationen leider nicht möglich.

 

[bercam]

Vielen Dank, aber ich habe noch eine kleine Frage.

Zum Checken verwende ich

Auf meinem Rechner habe ich Chrome, Safari, Firefox, Opera und wenn ich die o.g. Seite aufrufe und mein Design teste dann habe ich immer noch leichte Unterschiede.



Ist das einfach so ??

Gruß in die Nacht

 

[_schatzi_]

Hallo!

Dazu verweise ich einfach mal hierhin:
http://dowebsitesneedtolookexactlythesameineverybrowser.com/

 

[bercam]

Hallo,

gibts den irgendwo so etwas generelles wie bei den Rändern, wie
-webkit-....
-moz-background

denn ich kämpfe auch noch immer mit dem Hintergrund , mal ist er rechts abgeschnitten oder unten,

Wie definiere ich den Hintergrund am besten - für jede Auflösung einzeln -
oder so habe ich bisher. und definiere die Positionierung X Y mittels der entsprechenden Text Div's.

Das will ich aber nicht, denn ich will den Text ja je nach Auflösung anders gestalten, länge und Inhalt.



#MAIN {
clear: left;
float: left;
margin: 0px 2px 0px 2px;
width: 98%;
background-repeat: no-repeat;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-image: url(../schrankbau_img/main01.png);
}


Tschuldigung wenn ich so einfache Fragen stelle aber , ich hatte mich geistig schon 3mal verabschiedet.

 

[_schatzi_]

Hallo!

Was das ganze Prefixing (-moz-, -webkit-, usw.) angeht, ist http://caniuse.com/ eine sehr hilfreiche Adresse.

Für background-images und sonstige css-Problemchen nutze ich gerne http://css-tricks.com

Konkrete Hilfe zu deinem Code kann ich leider immernoch nicht liefern. Lade das ganze einfach bei irgendeinem Free-Hoster zum Testen hoch; dann wirst du sicher umgehend Hilfe erhalten.

Und entschuldigen für deine Fragen brauchst du dich hier schonmal GAR NICHT!
Dumme Fragen gibt es nicht. Es gibt nur Dumme, die nicht fragen.

 

[bercam]

ich lese mich da mal ein

Danke und ich wünsche immer Gesundheit - ein gutes Leben kann sich plötzlich ändern.

bis dann

 

[_schatzi_]

Hallo!

Das wünsche ich dir auch!
(Ich lebe ebenfalls bereits mein zweites Leben! )

 

[Myhar]

Noch ein paar Hinweise für die Präfixe: den Standardpräfix IMMER als letztes notieren. Das würde dann zB so aussehen: -webkit-border-radius, -moz-border-radius, -o-border-radius, -ms-border-radius, border-radius.
Ich habe hier border-radius als Beispiel genommen, weil mir auf die Schnelle keine Eigenschaft eingefallen ist, wo die Präfixe wirklich noch relevant sind. Brauchen tust du sie bei border-radius nämlich nicht mehr.

Zweitens (und das ist viel wichtiger):
Vergiss Du brauchst diese nicht und du brauchst sie auch nie wieder besuchen. Nicht, weil diese Seite nicht vertrauenswürdig ist, sondern weil du sie einfach nicht brauchst.
Drücke im Firefox Strg + Shift + M dann hast du eine viel bessere Möglichkeit, die einzelnen Größen zu testen.
Im Chrome (+ Opera) drückst du auf in den Entwicklerwerkzeugen (Rechtsklick -> Element untersuchen) auf das "Handy-Symbol" links oben in der Leiste.
Lediglich im IE sind die Werkzeuge nicht ganz so gut, aber in dem Entwickelt man auch nicht ;-)