Template bzw. CSS anpassen

Chaote · Post by **Chaote** » Sun May 06, 2007 1:34 pm

Hallo,

ich suche mir nun schon seit Stunden die Finger wund nach der Möglichkeit auch den Rest meines Templates komplett anzupassen.
Es handelt sich um dieses CMS: www.chaote.de

Ich möchte das die ganzen weißen Sachen verschwinden und alles komplett grau ist, so wie es in der Mitte der Fall ist.

Mein Problem ist jetzt das ich zwar mit Hilfe des Adminmenüs die Sache in der Mitte grau gekriegt habe, aber keine Ahnung habe wo ich die Stelle finde damit auch die anderen Sachen grau werden. z. B. um den grauen Kasten in der Mitte der weiße Kasten.

Wäre nett wenn mir jemand helfen würde.

Danke euch schon im vorraus.

Chaote

cyberman · Post by **cyberman** » Mon May 07, 2007 6:52 am

Chaote wrote: z. B. um den grauen Kasten in der Mitte der weiße Kasten.

Das ist ein Hintergrundbild, festgelegt im Stylesheet des Bodys - einfach entfernen und glücklich sein.

Chaote · Post by **Chaote** » Mon May 07, 2007 6:37 pm

Ok, schon mal Danke,

sry hab nur das Problem das ich keine Ahnung hab wie bzw. wo ich genau was entfernen soll.

Das habe ich zur Auswahl:

Accessibility and cross-browser tools
Album (für Default-, ImageGallery- und Thickbox-Vorlagen)
andreas01 : andreas01_print
andreas01 : andreas01_screen
andreas01 : Tools
Gästebuch (Standard-/Beispiel-Stylesheet)
Handheld
Layout: Left sidebar + 1 column
Layout: Top menu + 2 columns
Module: News
Navigation: CSSMenu - Horizontal
Navigation: CSSMenu - Vertical
Navigation: Simple - Horizontal
Navigation: Simple - Vertical
Print

cyberman · Post by **cyberman** » Tue May 08, 2007 6:26 am

Chaote wrote: sry hab nur das Problem das ich keine Ahnung hab wie bzw. wo ich genau was entfernen soll.

Dich etwas intensiver mit CSS zu beschäftigen, wird dir nicht erspart bleiben

- hier im Forum findest du auch ein paar hilfreiche Links dazu.

Und noch ein Tipp - verwende für die Webseitenentwicklung Firefox und dessen Erweiterung Webdeveloper Extension, das erleichtert einiges.

andreas01 : andreas01_screen

Ändere dort

Code: Select all

body {
margin: 0 auto;
padding: 0;
font: 76% Verdana,Tahoma,Arial,sans-serif;
background: #C0C0C0 url(uploads/andreas01/bg.gif) top center repeat-y;
}

in

Code: Select all

body {
margin: 0 auto;
padding: 0;
font: 76% Verdana,Tahoma,Arial,sans-serif;
background: #C0C0C0 top center repeat-y;
}

Chaote · Post by **Chaote** » Sun Jul 22, 2007 10:37 pm

Spät aber immerhin nochmal ein vielen Dank für deine Antwort,

ich habe nun ein weiteres Problem mit einem anderen Projekt.

http://schlachtfohlenhilfe.chaote.de/

Ich möchte hier 2 Sachen machen, einmal soll der Bereich in der Mitte sich über die gesamte Seite verteilen. So das praktisch außen der Weiße Rand weg ist und der Bereich rechts mit dem Text der soll ganz verschwinden sowie das News Modul auf die rechte Seite.

Hoff ich stell mich nicht wieder mal zu dumm an.

Jemand eine Idee?
Danke schonmal

rangitoto · Post by **rangitoto** » Mon Jul 23, 2007 8:03 pm

Hi!

Alles was bei dir erscheint, ist im CSS definiert. (Style/Position)

Bei der Sidebar würde ich mal, ohne dein CSS zu kennen, right eingeben - da steht jetzt left.

Um den content zu verbreitern, kannst du die Weite einstellen.

Den Bereich rechts kannst du auf verschiedene Arten verschwinden lassen. Definition im Template löschen.

Im Prinzip kannst du mit try + error einiges herausfinden. (wichtig ist nur ne Sicherung vom Original)

Gruss
Rangi

Poldix · Post by **Poldix** » Mon Jul 30, 2007 1:49 am

Hi Chaote,

wie Cyberman schon gesagt hat, ist Firefox mit der Erweiterung "Web Developer" ein muss, wenn es um Website Erstellungen geht. Dazu noch die Seite www.css4you.de und mit bissl Try&Error wirst du der CSS Profi werden

Mit 'Web Developer' hast du dann per rechter Maustatenmenu direkten Zugriff auf die verschiedensten Optionen, unter anderem die für dich sehr sehr hilfreiche Funktion "View Style Information" (auch über Strg+Shift+Y ein-/ausschaltbar)

Wenn diese Funktion eingeschaltet ist, kannst du mit deiner Maus über die vershiedenen DIV-Elemente fahren (direkt im Browser auf der entspregenden Website). Das aktuelle DIV bekommt dann einen roten Rahmen und die genaue Bezeichnung wird oben angezeigt.

Wenn du dann auf das Ausgewählte DIV-Element klickst, öffnet sich unten im Browser ein Bereich, der dir den CSS Bereich zu diesem DIV anzeigt.

Ich geb dir mal nen Screenshot:

Und hier nun der Quelltext auszug, und was für was verantwortlich ist:
Müsste alles im Layout 'andreas01 : andreas01_screen' drinstehen.

Code: Select all

#avmenu (line 90)

{

clear: left;          /* damit wird sichergestellt, dass wenn vorher bereits ein DIV mit float left kam, 
sich das #avmenu Div nicht rechts daneben packt, sondern drunter. das vorige float: left wird also gelöscht */

float: left;          /* damit sich das nachfolgende DIV #content nicht unter dem #avmenu stellt, 
sondern rechts rumfloatet, also einfach rechts daneben stellt.. stell beides mal anstatt left auf right..
also sowohl clear:right; als auch float:right;  ..wobei das clear:right;  glaube auch weggelassen werden kann */

width: 150px;    /*  dies gibt einfach die Breite an */

margin-top: 0pt;   /* Außenabstand nach oben des DIV #avmenu */

margin-right: 0pt;  /* nach rechts */

margin-bottom: 10px;    /* unten */

margin-left: 0pt;      /* links */

padding-top: 0pt;    /*  Padding bedeutet soviel wie 'Ausfüllen' ..beschreibt also den Innenabstand */

padding-right: 0pt;

padding-bottom: 0pt;

padding-left: 0pt;

font-size: 0.9em;

}

Code: Select all

#wrap (line 55)

{

background-color: #fdecb4;    /*diese rosa Hintergrundfarbe */

background-image: none;       /*  kein Hintergrundbild    */

background-repeat: repeat;    /*  keine Wiederholung eines evtl. vorhanden Hintergrundbildes  */

background-attachment: scroll;    

background-x-position: 0%;

background-y-position: 0%;

color: #f00c0c;       /*  die rote Schriftfarbe  */

margin-top: 0pt;

margin-right: auto;    /* automatischer Abstand nach rechts, in Verbindung mit margin-left:auto; bewirkt das eine Zentrierung  */

margin-bottom: 0pt;

margin-left: auto;

width: 760px;      /* wieder die Breite, hier auf width:auto; oder aber besser width:100%;   ändern */

}

Als letztes musst du dann noch in dein Template gehen (sollte wohl auch irgendwas mit andreas01 heißen) und dort dann das DIV #extras auskommentieren mit {* und am ende *}

Also

{*

alles was zu div extras gehört....
....
....
....

*}

CMS Made Simple Forums

Template bzw. CSS anpassen

Template bzw. CSS anpassen

Re: Template bzw. CSS anpassen

Re: Template bzw. CSS anpassen

Re: Template bzw. CSS anpassen

Re: Template bzw. CSS anpassen

Re: Template bzw. CSS anpassen

Re: Template bzw. CSS anpassen