CSS Code Fehler in Transparenter DIV BOX

[peku]

Alles nicht so wie es sein Soll das man den Text auf meiner OPEL HP Lesen Kann wollte ich ihn in ein DIV stecken ein besoderes Div
Ich bin absoluter anfänger in CSS Das Habe ich geschaft http://opelblitze-ldk.de.to/test_38120202.html
wie kommt das DIV in die Mitte der HP und der Text auch Mittig.
finde den code nicht margin geht net hier mein Code [spoiler]<center>
<p><style type="text/css">

div.transbox
{
width:300;
height:200;
top: 50%;
left: 50%;
background-color:#ffffff;
border:1px solid black;
opacity:0.6;
filter:alpha(opacity=60); /* For IE8 and earlier */
}
div.transbox p
{
font-weight:bold;
color:#000000;

}
</style></p>

<div class="transbox">
Wir,die Opel Blitze Lahn-Dill, sind eine Gruppe die aus 11 leuten besteht.
Wir sind eine lustige und fröhlige truppe dessen spaß und Hobby mit Opel zutun hat.
Unser Spaß besteht aus Feiern,Lachen,Schrauben auch mal schöne Grillparty´s und
natürlich nicht zu vergessen die Opel treffen die wir gemeinsam anfahren.
Groß geschrieben wird bei uns ZUSAMMENHALT,ERHLICHKEIT und GEMEINSAMKEIT.
Natürlich freuen wir uns wenn wir noch weitere Mitglieder gewinnen,
die mit uns die Leidenschaft und den Spaß am Clubleben teilen möchten.
Bei Interesse einfach über Kontakt formular,e-mail adresse oder über WKW unter Steven Pauss
in diesem Sinne Mit Blitzender Lichthupe die Opel Blitze Lahn-Dill
<p><br></p></div></center>[/spoiler]
Achso das Hintergrundbild so wie die schrift ist in einer externen css datei festgelegt ich habe dafür 3 Tage gebraucht laut information die ich gelesen habe macht das überall den Text gleich, die CSS Datei habe ich bei den Header einstellungen unter zusätzliches css angegeben da habe ich den code drin [spoiler]body {
background-attachment: fixed;
background-image: url(http://file1.npage.de/009163/92/bilder/ ... lpaper.jpg);
background-position: center;
background-repeat: no-repeat;
color: #ff8000;
font-family: "Comic Sans MS", "Arial Black";
font-size: 4pt;
text-align: center;
}[/spoiler]
oder ist es besser noch ein css datei zumachen und die dan im HTML aufzurufen die soll ja dann auf jeder textseite sein.
Ihr seid die experten bitte helft mir

[moni]

Hallo peku...
Soll das ganze etwa so aussehen ??http://blicke.npage.de/
hab eich an meine TEST HP installiert

wenn ja hier ist das skript ..Hedaer Bereich

Code: Alles auswählen

<p><style type="text/css">
body {
background-attachment: fixed;
background-image: url(http://file1.npage.de/009163/92/bilder/opel-calibra-2009-car-wallpaper.jpg);
background-position: center;
background-repeat: no-repeat;
color: #ff8000;
font-family: "Comic Sans MS", "Arial Black";
font-size: 16px;
text-align: center;
}
div.transbox
{
width:60%;
height:auto;
background-color:#ffffff;
border:1px solid black;
padding: 20px;
margin-top: 30%;
  margin-left:190px;
 
text-align:left;
opacity:0.6;
filter:alpha(opacity=60); /* For IE8 and earlier */
}
</style></p>

und das in Sitewide-Einstellungen
oben
Anfang jeder Seite

Code: Alles auswählen

<div class="transbox">

und in unteren bereich kommt

Code: Alles auswählen

</div>

soll doch anders sein da melde dich noch mal

[peku]

Geil auf diese Idee bin ich gar nicht Gekommen das Eine Header das andere Sitewide npage ist schon ne Tolle sache
Kann man das Hintergrundbild Strecken wie beim PC Hintergrundbild ????.
Die Homepage passt sich ja an verschiedene Auflösungen an.


Das Desing ist fast wie bei wordpress einfach cool

mfg PEKU

[moni]

was meinst mit strecken...??
ja das Design passt sich an verschieden Auflösungen nur muss Taufpassen das du das mit nicht zu großen Bilder sprengst

[peku]

Also da ist ja das Auto im Hintergrund das füllt die HP nicht aus auf meinem PC am Laptoop ist es perfekt an meinem PC nicht nur wenn ich das Browserfenster kleiner mache sieht es Toll aus.
Kann ich den die Homepage auf eine bestimmte Auflösung festslegen zum beispiel 1024x868 an dieser einstellung hing ich schon mal fest und ich weis nicht wie ich das erklären soll.
Der Mit der Dicken auflösung Hatt ja da einen Rahmen um die hp und der mit der schlechtem auflösunng sieht den rahmen nicht.
ich Habe halt nun mal so einen Fetten 16:10 Monitor andere eben nicht also die Ganze Homepage in die mitte des Bildschirms bringen
ich verzweifel noch dabei.

mfg Patric

[moni]

also hab eich auf 1024 mein Monitor umgestellt und in den Fall muss man das Fenster in die Mitte breiter machen...
normale weise habe ich 1280 mal 1024...da sieht alles supi aus...
wenn du noch größeren Auflösung hast da versuche es und mache das Hintergrund Bild in den body auf background-repeat: repeat;..mag wohl sein das du dann keine Rand bekommst...aber es wird dich dein Bild wieder wiederholen was auch nicht schön aussieht....
werde da an mein Test HP einiges austesten und sage dir dann beschied ob was geholfen hat

[moni]

sorry es ist nicht alle korrekt was ich vorher geschrieben habe...habe mir dein HP in 1024 Auflösung angeschaut und es sieht schlecht aus..die navi leiste ist nicht zu sehen... bin mir sicher das es an den großen HD bild liegt...der ist 1280 mal 960 viel zu groß

[peku]

das repeat geht sieht aber nicht gut aus meine Auflösung ist 1920x1200
bin am überlegen ob ich auf eigenes Desing umändere Das Navigationsmenü soll ja auch noch anderst werde am besten wäre bestimmt 1frame desing
ich probier mal aus mal sehn

bis Dann Patric

[moni]

wen du ein frame Design nähmst da muss die leiste mit einbauen in das Skript...
quasi ein feiges Design....
oder mache das HD etwas kleiner und für die Rest bastle ein andre hintergund Bild rein...
Moment ich teste das gleich auf mein test HP
...............nee sieht nach nichts aus.... bin irgendwie müde schon...
wenn mir was dazu einfällt da melde mich auf alle fälle :R :R

[goefi-chiangmai]

Hallo Patric

noch kurz zu deier ersten frage, wegen der CSS.
es ist nicht mittig, weil es absolut posizioniert ist.

Um den Text mittig zu setzten musst noch in der CSS text-align:center; rein.

Code: Alles auswählen

text-align:center;

Wenn die box mittig haben möchtest. Musst mal volgendes Versuchen (hatte keine Zeit um zu testen)
Die absolut positzion muss weg:

Code: Alles auswählen

top: 50%;
left: 50%;

und ersetzen mit:

Code: Alles auswählen

margin-left:auto;
margin-right:auto;
margin-top:auto;
margin-bottom:auto;

Versuch mal!