Panelboxen sind zu Nah am "Container" - Frage/Hilfe |
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 01.06.2012 um 22:42 |
|
Hallo Zusammen, ich bin gerade dabei mein Style neu zu Designen und würde gerne Wissen wie ich die Panelboxen nen stück von dem äußersten Rand mit dem Namen "container" weg bekomme.
Hier ist mal ein Panel als Vorschau so siehts zurzeit auch aus.
So sieht der container aus:
GeSHi: CSS .container { width: 988px; border: 1px solid #000000; }
gewandelt in 0.007 Sekunden, benutzt wurde GeSHi 1.0.8.10
habe schon versucht die breite zu vergrößern ohne Erfolg.
Die Panels:
GeSHi: CSS .side-border-left { color: #000000; background-color: #ddd; padding: 10px 10px 10px 0; width: 175px; } .side-border-right { color: #000000; background-color: #ddd; padding: 10px 0 10px 10px; width: 175px; }
gewandelt in 0.003 Sekunden, benutzt wurde GeSHi 1.0.8.10
Hier ebenfalls die breite mal verkleinert ohne Erfolg
Würde mich über Hilfe freuen! |
|
|
|
Senior Mitglied
|
DeeoNe Geschrieben am 01.06.2012 um 22:52 |
|
Das was bei padding 0 ist muss du was setzen wie 1px oder so. |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 01.06.2012 um 22:52 |
|
|
|
|
Senior Mitglied
|
DeeoNe Geschrieben am 01.06.2012 um 22:53 |
|
LoL habs gerade abgesendet und schon eine Antwort Oo Wie geht das. |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 01.06.2012 um 22:55 |
|
Der frühe Vogel fängt den Wurm :)
Zusammengefügt am 05. Juni 2012 um 08:37:50:
Ich hab da nochmal ein problem & zwar mit dem Capmain sprich wenn man die Panels nur auf einer bestimmten Seite anzeigen lässt ist die Panelbox Capmain wieder so nah am Rand:
Hier weiß ich aber nicht wo ich in der css suchen müsste ... firebug zeigt mir main-body an aber da steht:
GeSHi: CSS .main-body { font-family: Arial; font-size: 12px; color: #000000; background-color: #F1F1F1; border: 2px solid #f8c807; border-radius: 0px 0px 10px 10px; padding: 4px; }
gewandelt in 0.001 Sekunden, benutzt wurde GeSHi 1.0.8.10
Wenn man das padding ändert ändert sich auch der Inhalt im Panel ansich und nicht die entfernung vom Rand zur Box, hat jemand ne Idee ? |
Bearbeitet von Paramedic am 05.06.2012 um 08:37
|
|
|
|
Veteran Mitglied
|
Janilein Geschrieben am 05.06.2012 um 09:18 |
|
da währen dann z.b. noch side-border-left oder side-body, die für dich interessant sein könnten
side-border-left sollte das bei dir sein und dann einfach den entsprechenden padding-wert wählen
z.b.: padding: 10px 10px 10px 5px; |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 05.06.2012 um 09:26 |
|
Also side-border-left das wäre für die "Seitlichen" Panels die Links wäre. Side-Body ist ebenfalls für die Äußeren Panels. Ebenso wie oben schon geklärt musste ich das padding bei side-border-left und right ändern damit es so ist wie ich es haben wollte.
Ich würde Euch gern einmal nen Ausschnitt des Codes posten:
GeSHi: CSS /* Side-Panel properties */ .side-left .side-border-right {display: none;} .side-right .side-border-left {display: none;} .side-border { border: 1px solid #000000; border-radius: 5px 5px 5px 5px; } .side-border-left { color: #000000; background-color: #ddd; padding: 10px 10px 10px 2px; width: 175px; } .side-border-right { color: #000000; background-color: #ddd; padding: 10px 2px 10px 10px; width: 175px; } .scapmain { text-transform: uppercase; font-family: Arial; font-size: 12px; text-align: center; font-weight: bold; color: #FFFFFF; background-color:#CA0000; border-radius: 10px 10px 0px 0px; background-repeat: repeat-x; padding-left:6px; padding-right:6px; padding-top:4px; padding-bottom:4px } .side-body { font-family: Arial; font-size: 12px; color: #000000; background-color: #eee; background-repeat: repeat-x; border: 2px solid #CA0000; border-radius: 0px 0px 10px 10px; padding: 4px;
gewandelt in 0.001 Sekunden, benutzt wurde GeSHi 1.0.8.10
ggf. hilft auch das "Capmain" weiter:
GeSHi: CSS .capmain { text-transform: uppercase; font-family: Arial; font-size: 12px; text-align: normal; font-weight: bold; color: #000000; background-color:#f8c807; border-radius: 10px 10px 0px 0px; background-repeat: repeat-x; padding-left:6px; padding-right:6px; padding-top:4px; padding-bottom:4px }
gewandelt in 0.001 Sekunden, benutzt wurde GeSHi 1.0.8.10
|
|
|
|
Veteran Mitglied
|
Janilein Geschrieben am 05.06.2012 um 09:39 |
|
background-repeat: repeat-x; kannst du überall entfernen, da du keine Grafiken nutzt, die wiederholt werden müssten.
padding-left:6px; padding-right:6px; padding-top:4px; padding-bottom:4px ist zwar nicht falsch, geht aber einfacher und besser so: padding: 4px 6px; (Der erste Wert ist hier für oben und Unten, der zweite für Links und Rechts)
PS: Du solltest dir deine Webseite auch mal im IE anschauen. |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 05.06.2012 um 09:45 |
|
herzlichen Dank für deine Antwort Janilein, jedoch ändert sich durch padding der Abstand vom Container nicht sondern nur von den Inhalt der boxen. |
|
|
|
Veteran Mitglied
|
Janilein Geschrieben am 05.06.2012 um 10:00 |
|
Um welche seite handelt es sich überhaupt, die du versuchst anzupassen? Dann kann ich evtl. genauer helfen
Edit: Oder hast du die Linken Panele weggenommen? dann müsstest du main-bg anpassen
Edit: Ich sehe gerade du hast im Impressum die linke panele rausgenommen.
Du hast in main-bg padding: 10px 0 5px; d.h. bei 3 Werten, das du für links 0px vergeben hast.
Du könntest jetzt z.b. die 0 komplett entfernen und hättest einen abstand von 5px zum Rand. allerdings wirkt sich das auch auf die Seiten aus, wo die linken Panele trotzdem drin sind, d.h. du müsstest side-border-left evtl. etwas anpassen |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 05.06.2012 um 10:17 |
|
Es handelt sich um die Seite die in meinem Profil eingetragen ist aber kurz und knapp um http://4Friends.mod-rescue.de/. Da ich noch V 7.01.xx nutze hab ich auf div. Seiten über den Adminbereich die Linken Panels "abgeschaltet". Es könnte gut sein dass man an "main-bg" was ändern muss.
Hier mal der Auszug aus der CSS:
GeSHi: CSS .main-bg { color: #000000; background-color: #dddddd; padding: 10px 0 5px 0; }
gewandelt in 0.001 Sekunden, benutzt wurde GeSHi 1.0.8.10
Es kann natürlich sein dass ich immer mal wieder was übersehe *lach* |
|
|
|
Veteran Mitglied
|
Janilein Geschrieben am 05.06.2012 um 10:19 |
|
Habe meinen vorherigen Beitrag editiert und das sollte dir helfen können. |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 05.06.2012 um 10:21 |
|
Das hilft mir auf jeden Fall! Ich bedanke mich für die klasse Hilfe ! |
|
|
|
Senior Mitglied
|
Layzee Geschrieben am 05.06.2012 um 15:58 |
|
In Deinem Beispiel hiesse das padding für den main-bg:
Oben: 10px
Rechts: 0px
Unten: 5px
Links: 0px
Nochmal:
Regel: Bei nur EINER Zahl gilt dieser Wert für ALLE Seiten
Bei zwei Werten gilt der erste Wert für oben und unten, der Zweite für links und rechts.
Bei drei Wertangaben gilt der erste Wert für oben, der zweite für rechts UND links, der Dritte für unten.
Bei VIER Werten gilt immer die Reihenfolge OBEN, RECHTS, UNTEN, LINKS.
Wir sind wieder bei Grundkenntnissen, das ist reines Lernen und hat nichts mit "Verständnis" der Zusammenhänge zu tun Rescue ;)
Das sollte sich jetzt von alleine erklären, oder? |
|
|
|
Veteran Mitglied
|
Paramedic Geschrieben am 05.06.2012 um 16:05 |
|
Gut, soweit hab ich das nun Verstanden. Es ist richtig, dass es was mit den Grundkenntnissen zu tun hat nur alles zusammen lernen geht nicht. Derzeit beschäftige ich mich mit Tabellen was mir auch Gut gelungen ist (Siehe hier:http://4friends.mod-rescue.de/Steckbr...kbrief.php). Ich werde natürlich mich nach den HTML-Kenntissen an die CSS machen. Nur wie gesagt alles zusammen geht wirklich nicht. Vor kurzem hab ich Intensiv damit angefangen HTML-Grunkenntnisse anzulernen. |
|
|