Welches Design? Sidebar unter Navigation?
...das kannst du alles testen!
1. öffne die Seite im Chrome Browser
2. öffne die dev-Tools (strg+I)
3. klick auf das Handy-Symbol oben links (das 2. Symbol)
4. suche Dir das Gerät aus, welches Du testen möchtest
5. Taste F5 zum aktualisieren
Wenn Du testen möchtest, wie es auf einem Handy aussieht, hänge an die URL der Seite "/?mobile=1" an.
(...und damit Google glücklich ist, solltest Du unbedingt die mobile Ansicht aktivieren!)
LG, az
PS:...damit meine Testseite (http://dublin-test.jimdo.com/) auf dem IPad richtig dargestellt wird, habe ich eine sog. media-query hinzugefügt. Ich hab mein Layout Deiner Testseite angepasst. Diese media-query müsste also auch bei Dir passen:
2
3
4
5
6
7
8
9
@media (max-width: 1240px) /* Breite Browserfenster */{
#content {
width: calc(100% - 330px);
}
#cc-m-12627153935 { display:none;}
/*zweite Sidebar verschwindet, wenn Browserfenster schmaler als 1240px */
}
Infos dazu hier: https://wiki.selfhtml.org/wiki/CSS/Media_Queries
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= 
) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Supi, danke! Hab ich eingegeben.
Jetzt noch eine Frage: 
Ich hätte den Content gerne schmaler. Hab ich grad schon ausprobiert, aber dann sind die 2 Sidebars nicht passend......
...dafür musst Du mit den Werten für .layout-alignment und #content spielen. z.B.:
2
3
4
5
6
7
8
9
10
.layout-alignment {
width: 90%;
}
#content {
position: absolute;
z-index: 1;
width: calc(100% - 662px);
margin-left: 270px;
border: 1px solid #ccc;
}
LG, az
PS: Du kannst Dem Content auch eine fixe Breite zuweisen, z.B.: #content {width: 650px !important; } Dann musst Du aber den Randabstand der rechten Sidebar prozentual anlegen, am besten mit calc(...), oder Du gibst allen Breiten fixe Werte.
LG, az
.
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
...oder Du legst die rechte Sidebar so, dass sie den Content ein kleines bisschen überlappt - dann musst Du ihr aber einen höheren z-index geben, als #content hat:
2
3
4
5
6
7
8
9
#cc-m-12627153935 {
z-index: 200;
position: absolute;
left: 1000px;
top: 20px;
width: 260px;
background-color: white;
border: 1px solid #ccc;
}
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Hallo @nykytah,
...ich finde, Du machst das sehr gut! Aber jetzt scheint Dir was daneben gegangen zu sein, oder?
versuch mal diesen Code, ob dir das gefällt:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
.layout-alignment {
width: 1180px !important;
margin: 0 auto !important;
}
#content {
margin-left: 15em !important;
margin-top: 0 !important;
width: 40em !important;
border: 1px solid #ccc;
z-index: 10;
-webkit-box-shadow: 9px -1px 5px -6px rgba(97,97,97,1);
-moz-box-shadow: 9px -1px 5px -6px rgba(97,97,97,1);
box-shadow: 9px -1px 5px -6px rgba(97,97,97,1);
}
#sidebar {
position: absolute;
margin-top: 20px;
width: 16em;
border: 1px solid #ccc;
z-index: 20;
-webkit-box-shadow: 9px -1px 5px -6px rgba(97,97,97,1);
-moz-box-shadow: 9px -1px 5px -6px rgba(97,97,97,1);
box-shadow: 9px -1px 5px -6px rgba(97,97,97,1);
}
#cc-m-12627153935 {
z-index: 20;
position: absolute;
left: 54em !important;
top: 0;
width: 16em;
background-color: white;
border: 1px solid #ccc;
-webkit-box-shadow: -9px -1px 5px -6px rgba(97,97,97,1);
-moz-box-shadow: -9px -1px 5px -6px rgba(97,97,97,1);
box-shadow: -9px -1px 5px -6px rgba(97,97,97,1);
}
...über den Content wirst Du dann ja wohl noch die Slideshow setzen, schätze ich? Dafür musst Du nur den margin-top bei #content noch einmal anpassen, dann sollte das auch funzen.
Diesmal habe ich alles mit fixen Breiten gemacht, da dürfte es keine Überraschungen geben. Probier es auch mal ohne @media auf dem IPad, das müsste jetzt auch klappen.
...bei mir sieht es so aus:
LG, az
Testseiten:
http://drachenkinders.jimdo.com/
http://dublin-test.jimdo.com/
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
...es sind nur 3 Parameter, die Du ändern mussst, z.B.:
.layout-alignment {width: 1280px !important;}
#content {width: 46em}
#cc-m-12627153935 {left: 60em !important;}
LG, az
PS: ...und #sidebar {background-color: white;} hatte ich noch vergessen :)
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Guten Morgen az,
ja, schön. So gefällt es mir jetzt: http://drachenkinders.jimdo.com
So werde ich es jetzt dieses Wochenende auf die richtige Homepage umsetzen.... :-)
Klasse! Ich danke dir soooooooo sehr. 
:) Bitte sehr! ...hier der direkte Link zu unserer: "Kaffeekasse" - Spenden sind immer willkommen!!
LG, az
PS: ...gefällt mir auch sehr! Danke für dieses tolle Thema und die vielen Anregungen!!!
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Cool, hab ich doch gleich per PayPal gemacht.
Ja, ich hoffe es klappt dann alles so wenn ich es jetzt dann in die richtige Homepage setze. Ansonsten komm ich wieder vorbei.....
Bist du eigentlich auch ein Design Profi, Photoshop und so....?
lg
Hallo @nykytah,
...super! Vielen Dank! Die "Kaffeekasse" freut sich!
Die habe ich übrigens mit einem Jotform-Formular gemacht - das ist eine gute Idee, wenn man Bestellformulare etc. für die eigene Jimdo-Seite braucht. Hier findet Ihr einen kleinen Artikel darüber: http://www.redesign-berlin.de/jimdo-tuto...jimdo-business/:
LG, az
PS: ...wenn Du Hilfe brauchst bei der grafischen Gestaltung Deiner Webseite oder bei einzelnen Elementen, kannst Du mich gern anschreiben. Sowas mache ich auch sehr gern!
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Ähnliche Themen
| Thema | Antworten | Aufrufe | Letzte Aktivität | ||
|---|---|---|---|---|---|
 |
Design Dublin - Navigation und Sidebar fixierenDesign Dublin - Navigation und Sidebar fixieren |
1
sgrafik
24.01.2025 |
201 |
|
|
|
Design Malaga - Navigation verbreiternDesign Malaga - Navigation verbreitern |
1
sgrafik
13.07.2021 |
979 |
|
|
|
Nur aktives Element in der Sidebar Navigation markierenNur aktives Element in der Sidebar Navigation markieren |
2
chris37170
22.02.2019 |
872 |
|
|
|
Welches DesignWelches Design |
3
Charles
07.09.2018 |
720 |
|
|
|
Design Lille Navigation auf einer LinieDesign Lille Navigation auf einer Linie |
1
az_
07.11.2017 |
972 |
|
|
|
Design Miami Navigation verändernDesign Miami Navigation verändern |
6
sgrafik
04.10.2017 |
1362 |
|
|
|
Welche Design ist das?Welche Design ist das? |
2
az_
23.07.2017 |
769 |
|
|
|
Design Milano, Navigation fixieren...Design Milano, Navigation fixieren... |
11
az_
09.10.2018 |
3242 |
|
|
|
Design zürich Navigation fixieren am oberen Bildschirm BereichDesign zürich Navigation fixieren am oberen Bildschirm Bereich |
2
the-martin
20.01.2017 |
1541 |
|
Jetzt anmelden!
Jetzt registrieren!
