Suche im Forum:
Suchen


Autor Nachricht
Beitrag10.05.2009 um 12:02 (UTC)    
Titel: Header verschieben im Design CSS

Hi,
ich habemir die Finger wund gesucht, aber nur Sachen wie "Headline entfernen" gefunden!
Ich möchte ihn aber nur verschieben; in die Mitte (aber nicht mit center oder sowas sondern eine variable px-zahl!)
wäre nett wenn mir jemand sagen könnte, wie das geht!
hier der code:

#header_container {
position: absolute;
left: 50%;
margin-left:-590px;
top: 20px;
width: 1200px;
height:120px;
background-color:#343434;
background-image:url(http://img.webme.com/pic/f/free-picture/gamebanner.jpg);
color:#FFFFFF;
font-size:13px;
border: 1px solid #FFFFFF;}

#headline{
position: absolute;
left: 50%;
padding-top: 120px;
padding-left: 100px;
color: white;
font-family: Verdana;
font-size: 20px;}



#nav_container{
position: absolute;
left: 50%;
top:140px;
margin-left: -470px;
width: 160px;
border:1px solid #FFFFFF;
-moz-border-radius-topleft: 100px;
-moz-border-radius-bottomleft: 100px;}

ul#nav{
width: 130px;
padding: 15px;
margin: 0px;
padding-bottom: 50px;}

li.nav_element{
list-style-type: none;
position: relative;
padding:5px;
width: 115px;}

li.nav_element a{
display: block;
width: 115px;
padding:4px;
font-weight: bold;
text-decoration: none;
text-align: left;
color:blue;
background-color:#343434;
background-image:url(HIER BUTTON-ULR_1);
border: 2px solid #000000;}

li.nav_element a:hover{
color: #000000;
background-color:#C9C9C9;
background-image:url(HIER BUTTON-URL_2);}


#content {
position: absolute;
left: 50%;
top: 140px;
margin-left:-310px;
width: 590px;
height: 700px;
padding:10px;
color: #F2F2F2;
font-size:13px;
background-color:#343434;
background-image:url();
border: 1px solid #FFFFFF;
-moz-border-radius-bottomright:100px;
-moz-border-radius-bottomleft:100px;
overflow:auto;}


#counter{
position: absolute;
left: 50%;
top: 90px;
margin-left: -10px;
padding-right:10px
width: 180px;
height: 20px;
color: black;
font-size:13px;
border: 2px solid purple;
-moz-border-radius: 75px;}


body {
background-color:#000000;}

#Mein_Bild {
margin: 0 auto;
width: 1200px;
height:800px;
background-image:url(http://img.webme.com/pic/n/nico-pb-page/pc11.gif);}


a:link {
color: white;
font-size: 13px;
text-decoration: underline;}


#sidebar_container{
position: absolute;
left: 50%;
top:140px;
margin-left: 301px;
width: 230px;
height: 400px;
background-color:#343434;
background-image:url;
border:1px solid #FFFFFF;
-moz-border-radius-topright: 50px;
-moz-border-radius-bottomright: 50px;
color:#000000;
overflow:auto;}


Zuletzt bearbeitet von nico-pb-page am 10.05.2009, 13:20, insgesamt 2-mal bearbeitet
Beitrag10.05.2009 um 12:08 (UTC)    
Titel:

Es gibt keine Klasse headline im Design "CSS".
Außerdem solltest Du kurzfristig Deinen Code so anpassen, dass man die Werbung wieder sehen kann.
Beitrag10.05.2009 um 12:18 (UTC)    
Titel:

Hallo,

Du arbeitest in deinen Klassen mit left: 50% ; .
Dein Header ist 1200 Pixel breit .
Bildschirmmitte wäre immer margin-left: 0px;
Linke Außenkante vom Header wäre dann margin-left: -600px; (Minuszahl)
Rechte Außenkante vom Header wäre margin-left:600px; (Pluszahl)
600 + 600 = 1200 (Deine Headerbreite) .

Das heißt, um deinen Header nach links oder rechts zu verschieben ,
müsstest du mit margin-left: arbeiten .
Für dich absolut mittig wäre er bei margin-left:-600px; (Minuszahl).

Du solltest beim gestalten der Homepage auf die Besucher achten,
die eine Bildschirmauflösung von 1024 x 768 haben .
Soll links und rechts noch ein sauberer Abstand zum Bildschirmrand bleiben ?
Dann sollte Dein Homepage-Design, bzw Dein Header die Breite von 980 Pixel nicht überschreiten .

Headerbreite 980 : 2 = 490px;
Um einen 980 Pixel breiten Header für alle Bildschirmauflösungen mittig zu
platzieren , müsste #header_container das margin-left:-490px; bekommen Very Happy

Gruß Wolfgang


Zuletzt bearbeitet von 24939 am 10.05.2009, 13:20, insgesamt einmal bearbeitet
Beitrag10.05.2009 um 13:51 (UTC)    
Titel:

das weiß ich selbst!
aber wie soll ich mir margin arbeiten, wenn ich nicht die richtige klasse habe?!?

außerdem: das stand hier im forum mit td.headline!

erledigt!!! endlich
mit #header gings!
obwohl ja bei iceblue td.headline der titel ist und auf der hilfeseite steht auch:

zuerst klassen entfernen:
...
#h1.title (oder sowas)
....
aber als ich mir dann den quelltext angesehen habe, habe ich bemerkt, dass bei titel id="header" steht

ERLEDIGT


Zuletzt bearbeitet von nico-pb-page am 10.05.2009, 15:49, insgesamt einmal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de