Beiträge von Drag and Drop

Hab jetzt folgendes gemacht: klasse5 über Custom CSS definiert

und anschließend die Bezeichnung klasse5 in den CSS-Bereich des Widgets eingesetzt.

Aber auch +1600 Breite ist das Feld sichtbar.

Custom-CSS:

.klasse5: Media only screen and (max-width: 1600px) {

display:none;
}

Hi,

ich möchte gerne Bilder über ein Widget einfügen und dieses

für alle Desktop-Bildschirme responsive machen.

Ich wollte mit Media Queries arbeiten und diese in den "Eigenen CSS"-

Bereich des Feldes einfügen, dass ich danach als Widget speichere.

Media only screen and (max-width: 1600px) {

}

Ich dachte, dass der Code alleine schon reicht, um dem Widget klar zu machen,

dass es ab jetzt nur noch auf Geräten bis zu 1600px sichtbar ist. Hat nicht geklappt.

Fehlt noch ein Befehl??

Danke für Eure Hilfe

Wie müsste es richtig sein? Nur body #page ohne html?

Ja ich weiß :|. Das geht aber leider nicht.
Der Inspektor hilft ungemein.
Ich hatte beim ersten Versuch bloß eine Bezeichnung vergessen und schon...
Genauigkeit ist bei CSS,HtML.. einfach alles

Ich habs gefunden. Folgende Formatierung passt für alle. Danke für Eure Zeit und Geduld!!!

Media only screen and (max-width: 500px) {

html, body #page {
margin: 0em 0em;
}

Ixch habs noch mal kurz skiziert: A = Angezeigt-Seite
--- = Ränder

-------------- AAAAAAAAA --------------

Die Ränder sollen mindestens halbiert werden, damit sich der Content-Bereich wieder ausbreiten kann.

Ich hab schon folgendes ausprobiert: Geht aber nicht

Media only screen and (max-width: 400px) {

body {
margin: 0em 0em;
}
}

Ich hatte eigentlich schon in der Frage formuliert, dass die Seitenbreite bei kleinen Smartphones verengt ist.

Sorry ein wenig ungeschickt ausgedrückt.

Die Ränder der Seite werden bei kleinen Smartphones sehr groß, sodass

beide Ränder zusammen so groß wie die angezeigte Seite sind. Dadurch wird das Menü sehr klein

und zeigt die Reiter nicht mehr richtig an. Ich möchte das der Content-Bereich und das Menü wieder

breiter werden.

Danke für Eure Hilfe

Die 2 em hab ich auf null gesetzt.

margin: 0em 0em;

Media screen and (max-width: px)
#page {

}

Was soll ich denn eingeben, um z.B. das Smartphone 4 responsive zu machen?

Es muss hierfür doch einen Standard-Befehl geben wie für andere Dinge (hover, font...) auch??

Ab ca. 400px (iPhone6 / Nexus) wird alles perfekt dargestellt. Es geht nur um diesen kleinen

Abschnitt von 300 zu 400 px.

[FONT=Consolas][COLOR=#888888][COLOR=#222222]Ich hab die Seite mit dem Inspektor untersucht und einfach keinen Weg gefunden,

die Breite von den kleinen Smartphone zu verändern.

Nach meiner Logik müsste ich doch einfach nur den Media Querie-Befehl mit dem

Befehl zur Seitenbreite kombinieren??

Media screen and (max-width: 782px)[/COLOR]
[/COLOR][COLOR=#888888][COLOR=#222222]html[/COLOR][/COLOR] {
#page {
max-width: 500px !important;
}
[/FONT][FONT=Consolas]}

oder

[/FONT] Media (max-width:768px) {
#page {
max-width: 500px !important}
}
[FONT=Consolas]
[/FONT][FONT=Consolas]
Das iPhone 4 ist beispielsweise bei 320 mal 480 Pixel.

Durch obige Formatierung müsste das Geräte doch eigentlich mit beiden Breiten angesprochen werden?

Wenn ich #page {} weglasse, funktionierts auch nicht.[/FONT]

Hi,

ich habe gerade meine Seite auch für alle großen Bildschirme (bis 2000px)

eingestellt und danach gemerkt, dass sich die Seitenbreite der

kleinen Smartphone (Breite ca. 320px, iPhone 4...) verengt hat. Dreht man sie

um 90 Grad wird alles perfekt angezeigt.

Ich hab im Custom CSS folgenden Befehl eingegeben:

html, body

#page {
margin: 2em 2em;
max-width: 2000px !important;
}

Frage: Kann ich über media queries die Smartphone (Tablets gehen alle)

wieder breiter machen, also zum ursprünglichen Zustand zurückführen?

Klasse 44 hab ich definiert, um die später im Textbereich bei "CSS Klassen" einzusetzen. Hat bisher bei Hover...
ganz gut funktioniert.

Hallo,

ich würde gerne beim Breadcrumb-Plugin NavXT die Farbe der Verlinkungen ändern.
Über folgende Formatierung kann man dies für alle Seiten tun

.breadcrumbs .breadcrumbs a { color: #8cb9ea;
}

Ich möchte aber für einzelne Seiten eine andere Farbe nutzen.
Ich hab versucht dies über eine Klasse zu regeln, aber das funktionierte nicht.

.klasse44:.breadcrumbs a { color: #8cb9ea;
}

und

.klasse44: a {
color: #8cb9ea;
}

und

.klasse44: Link {
color: #8cb9ea;
}

Das mit den 100 px hat nichts gebracht.

Die folgende Formatierung passt endlich für alle. Das Wichtige sind

die max-width 1100. Was ich nicht ganz versteht ist, wenn ich die 1100 auf 1200 hochsetze, dann wird

die Formatierung meines Notebooks verändert. Ich dachte der Befehl Media gilt nur für die mobilen Geräte, also

Tablets und Smartphone??

Ein weiterer Punkt ist, dass ich die Schriftgröße der Smartphones nicht verändern kann, auch wenn ich die Font-Size

auf 10 px runtersetze. Zufällig passt die Schriftgrößte aktuell ganz gut.

h1 {
line-height: 0.4em ;
color: #494949 !Important ;
}

h2 {
color: #494949 !Important ;
}

Media only screen and (max-width: 500px) {
h1 {

line-height: 0.6em !Important;
font-size: 40px;
}
}

Media only screen and (max-width: 1100px)
{
h1 {

line-height: 0.45em;
font-size: 40px; }
}

Danke. Hab das mit den Media Queries eingestellt. Bei mir sind jetzt alle Geräte
ob Desktop, Laptops, Smartphones von A-Z und Tablets responsive, bis auf
die Samsung Galaxy Tablets.
Bei der normalen Ausrichtung (schmal) ist alles perfekt,
aber wenn ich es um 90 Grad drehe, dann wechselt er automatisch in die Desktop-Version
und die Überschriften und Bilder verziehen.

Habe ich irgendwo eine Breite falls eingestellt?

Hier sind alle Geräte vorhanden:

https://mydevice.io/devices/

Und hier sind meine Custom CSS Einstellungen:

h1 {
line-height: 0.6em;
color: #494949 !Important ;
}

h2 {
color: #494949 !Important ;
}

Media only screen and (max-width: 500px) {
h1 {

line-height: 0.6em;
font-size: 40px;
}
}

Media only screen and (min-width: 600px) {
h1 {

line-height: 0.45em;
font-size: 40px; }
}

Hallo,

ich möchte meine Webseite SEO-optimieren und füge

dazu überall die von Google gewünschten H-Überschriften ein.

Für Desktop und Tablet ist alles super, aber beim Smartphone

klappt es nicht, da er die Überschriften verzieht.

Ich möchte nur wissen, ob es für Google reicht, wenn man die

Tags nur z.B. für Desktop macht oder wird die Seite bei

Smartphone-Nutzung schlechter "gerankt".

Eigentlich müsste die Suche bei Google bei Smartphone

und Desktop identisch sein oder macht Google einen

eigenen Aufbau seiner Suchmaschine fürs Smartphone?

Ich hab mittlerweile bestimmt Hunderte verschiedenster Plugins ausprobiert und von denen konnte

man eigentlich nur ein Bruchteil gebrauchen. Bevor ich jedes mal wieder zu einem Thema

10 Plugins ausprobiere, ist es doch sinnvoller Experten zufragen, die einem direkt ein Gutes empfehlen.

Es nervt einfach, dass man bei den meisten Plugins immer wieder Anpassungen machen muss,

damit alles mit dem eigenen Theme kompatibel ist und und und...

Trotzdem Danke für deine Empfehlung

Hi,

ich suche ein Plugin, mit dem ich simpel eine Schlagwort-Wolke mit

Verlinkungen bauen kann. Keine Kacheln oder Buttons.

Am besten ein Plugin, dass mit Shortcodes arbeitet.

Viele Grüße

Drag and Drop

Ich habs gelöst. Die Linienabstände "Line-Heights" müssen im CSS verändert werden.
Für die Farbänderung brauchte ich den !Important-Befehl.

Ist es eigentlich schädlich, wenn zu häufig der !Important-Befehl genutzt wird?

h1 {
line-height: 0.6em;
color: #494949 !Important ;
}

h2 {
color: #494949 !Important ;
}

Hi Hille,

den Link kann ich leider nicht liefern.

Reicht es wenn ich dir das Child Theme einstelle?

Hallo,

ich möchte aktuell meine Seite SEO-optimieren und setze dafür H1 und H2-Überschriften.

Das Problem ist, wenn ich eine H1 Überschrift setze, dann es entsteht eine unschön große

Lücke zu H2. Dies kann so nicht stehen bleiben.

Mir wurde vom Page Builder gesagt, dass dies am Theme (Twenty Eleven) liegt.

Jetzt würde ich gerne wissen an welcher Stelle im CSS ich dies verändern kann.

Wie immer bedanke ich mich für Eure Zeit und Mühen