PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : [HTML/CSS/JS] css Headerbanner 1.2.4


Everlast3310
30.04.2010, 22:03
Hallo, ich versuche schon seid ein paar Stunden den Headerbanner aus zu richten. Bekomme das einfach nicht hin. Der Werbeplatz sollte wie beim alten vms rechts in der Headergrafik positioniert werden. So schauts momentan aus Link (http://www.klick4.de). Das problem ist, dass wenn ich das browserfenster verkleinere, sich dann dauch der Werbeplatz verschiebt. Hier mal meine Header.php

<body>
<div id="main">
<div id="header">
<a href="<?=$domain;?>"><img src="images/logo.png" alt="<?=$seitenname;?>" id="logo"></a>
<div id="topnav">
<ul>
<li><a href="<?=$domain;?>">Startseite</a></li>
<li><a href="?content=/intern/anmelden">Registrieren</a></li>
<li><a href="?content=/intern/mediadaten">Mediadaten</a></li>
<li><a href="?content=/intern/agbs">AGB</a></li>
<li><a href="?content=/intern/faqs">FAQ</a></li>
<li><a href="?content=/intern/impressum">Impressum</a></li>
</ul>
</div>

<div id="banner">
<?@require_once ('lib/texte/alt_headerbanner.txt');?>
</div>Und hier meine css

#banner {
position:absolute; top:15px; right:200px;
height:60px;
width:468px;
background-image:url(../images/banner_bg.png);
background-repeat:no-repeat;
}Hoffe mir kann da jemand nen Tip geben.
EarlofMidnight
30.04.2010, 22:36
<body>
<div id="main">
<div id="header">
<a href="<?=$domain;?>"><img src="images/logo.png" alt="<?=$seitenname;?>" id="logo"></a>
<div id="topnav">
<ul>
<li><a href="<?=$domain;?>">Startseite</a></li>
<li><a href="?content=/intern/anmelden">Registrieren</a></li>
<li><a href="?content=/intern/mediadaten">Mediadaten</a></li>
<li><a href="?content=/intern/agbs">AGB</a></li>
<li><a href="?content=/intern/faqs">FAQ</a></li>
<li><a href="?content=/intern/impressum">Impressum</a></li>
</ul>
</div>
<center>
<div id="banner">
<?@require_once ('lib/texte/alt_headerbanner.txt');?>

</div>
</center>



Versuch das mal

Gruß

EarlofMidnight
Everlast3310
30.04.2010, 22:45
Das <center> hat leider nix gebracht.
dude32
30.04.2010, 22:56
position:absolute; top:15px; right:200px;


damit kannste du einstellen wo der header von oben "top" bzw von rechts "right" in pixel stehen soll, je weniger du "top" hast um so höher wird der banner ausgegeben

probiere doch mal top: 10px
Everlast3310
30.04.2010, 22:59
Darum gehts ja nicht, das Problem ist, dass wenn ich das browserfenster verkleinere, so verschiebt sich auch der Werbebanner. Und das möchte ich halt ändern, dass er an der stelle bleibt, auch wenn ich das Browserfenster verkleiner.
Hier nochmal nur der code, den es betrifft.
header.php
<div id="banner">
<?@require_once ('lib/texte/alt_headerbanner.txt');?>

</div>css datei
#banner {
position:absolute;top:15px; right:200px;
height:60px;
width:468px;
background-image:url(../images/banner_bg.png);
background-repeat:no-repeat;


}
Lokutos
30.04.2010, 23:01
absolute ist ein fixer wert vom brwowserfenster mach es mit relative das ist einfacher zu handhaben



#banner {
position:relative;
top:-150px; left:400px;
height:60px;
width:468px;
background-image:url(../images/banner_bg.png);
background-repeat:no-repeat;
}
dude32
30.04.2010, 23:04
ah jetzt versteh ich


position:absolute; top:15px; right:200px;


ändern in


position:relative; top:15px; right:200px;
Everlast3310
30.04.2010, 23:06
Dankeschön, das hat geklappt :-). Habe das zwar vorher auch schon probiert aber da ging es komischer weise nicht. Vielen Dank nochmal. Jetzt gehts :thumb:
Everlast3310
30.04.2010, 23:11
Ah misst, hat fast geklappt. Jetzt hab ich allerdings zwischen der vav leiste und dem content nen riesen Absatand.
Lokutos
30.04.2010, 23:15
#header {
margin:0 auto 0 auto;
width:902px;
height:165px;
}
Everlast3310
30.04.2010, 23:16
Ja, das steht so in meiner css
Lokutos
30.04.2010, 23:17
nö da steht

#header {
margin:0 auto 0 auto;
width:902px;
}


brauchst aber

#header {
margin:0 auto 0 auto;
width:902px;
height:165px;
}
Everlast3310
30.04.2010, 23:20
Ja danke, eben gesehen und wo zu brauche ich die 165 px, bzw. wie hast du das so schnell erkannt? Gibts da irgend wie nen Programm wo du die Fehler siehst? Habe mich ja auch in css eingelesen und muss sagen, lernen tut man dann nur durch erfahrung.
Lokutos
30.04.2010, 23:23
also n programm nicht einerseits erfahrung andererseits kann man ja recht gut die css verändern mit firebug (firefox addon) das ein hight rein muss ist das können das es 165 px sind findet man mit probieren raus

MFg Lokutos
Everlast3310
30.04.2010, 23:25
Aber im IE ist das design jetzt zerschossen.
Lokutos
30.04.2010, 23:43
meld dich morgen mal bei mir im skype dan kann man ds ordentlich aufbauen

das 1.2.4 design ist für den aufbau bisschen kompliziert aufgebaut

andere aber in der header.php mal den Doctype in folgenden:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Everlast3310
30.04.2010, 23:54
werde ich machen, danke dir.
Everlast3310
01.05.2010, 15:08
So, hab jetzt schon relativ viel alleine hin bekommen. Zumindest auch so, dass alles mit dem IE identisch ausgegeben wird. Jetzt noch ne Frage. Ist es möglich ein img mit css zu strecken also ohne repeat? Momentan sieht das ganze so aus Link (http://www.klick4.de). Der Hintergrund mit verlauf hört dann auf.

Edit: Hat sich erledigt. Hab das bg img einfach vergrößert und einen Verlauf in #FFFFFF gemacht.