• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Hilfe?!

G

-=GlobalLove=-

Neues Mitglied
HabboExplorer • Wartungsmodus ist meine HomePage. Soo wir sind zurzeit im Wartungsmodus und ich will 5px über dem header und 1px neben dem header bis 1px unter dem header eine grafik einsetzen.


HTML-Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>HabboExplorer &bull; Wartungsmodus</title>
<link rel="shortcut icon" type="image/x-icon" href="./img/favicon.png">
<style type="text/css">@import url('style.css');</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="content-language" content="de" />
<meta name="robots" content="index, follow, noarchive" />
<meta name="description" content="HabboExplorer ist eine Fanseite zum deutschen Habbohotel!" />
<meta name="keywords" content="habboexplorer, habbo, explorer, fanseite, aktuell, infos, hotel, taler, events" />
</head>
<body>
<div id="dickie"></div>
<div id="wrapper">
<div id="top"></div>
<div id="bar"><center>Wir befinden uns derzeit im Wartungsmodus!</center></div> <div id="main">Hallo Habbo,<br />zurzeit befinden wir uns im Wartungsmodus.<br />Bis wir wieder frei zugänglich sind, musst du dich noch ein wenig gedulden!<br /><br />Natürlich suchen wir noch einige Mitarbeiter die uns unterstützen!<br />Wir suchen Techniker,Eventmanager,Community Manager,Infocenter Mitarbeiter und Newsschreiber! Vorraussetzung sind gute Kentnisse und Teamspeak, da wir absofort auf hohe Sicherheit Wert legen!<br />Bewerben kannst du dich unter <a href="mailto:[email protected]">Bewerbung @habboexplorer.de</a><br /><br />Viel Glück wünscht euch<br /><p><b>Die Administration</b></p><br><br></div><div id="footer">&copy HabboExplorer.de ~ -=GlobalLove=-
</div>
</body>

</html>
Zum Vergrößern anklicken....

CSS-Code:

/* Copyright by HabboExplorer 2010 */

body {
background-image: url('./img/background.png');
font-family: verdana;
font-size: 11px;
}

a:link, a visited {
color: gray;
}

#dickie {
background-image: url('./img/dickie.png');
widht: 197px;
hight: 321px;
}


#wrapper {
width: 503px;
margin: auto;
margin-top: 85px;
}




#top {
background-image: url('./img/top.PNG');
width: 503px;
height: 68px;
}

#bar {
background-image: url('./img/bar.PNG');
width: 498px;
height: 18px;
color: #ffffff;
padding-top: 5px;
padding-left: 5px;
}

#main {
background-image: url('./img/main.PNG');
width: 498px;
height: auto;
padding-top: 5px;
padding-left: 5px;
padding-bottom: 5px;
}

#footer {
background-image: url('./img/footer.PNG');
width: 498px;
height: 14px;
color: #ffffff;
padding-top: 5px;
padding-left: 5px;
}
Zum Vergrößern anklicken....

dickie ist die Grafik oder eher das was ich definiere. diese Grafik möchte ich links haben aber wie? :o
 
Zuletzt bearbeitet:
Hallo

also
über dem header
Zum Vergrößern anklicken....
was für ein header?
dickie, top, bar ...?

diese Grafik möchte ich links haben aber wie?
Zum Vergrößern anklicken....
Links von wo, jetzt gehts über die ganze breite oder?

Mach mal ein Link, denn ich habe nicht alle deiner bilder um das in Aktion zu sehen.

ps: hast ein das </div> für den wrapper vergessen am schluss. Das darf aber nicht passieren, sonst suchst dir ein Wolf.

Cheffchen
 
Gib mal dem Body ein position:absolute mit und dann dem Bild ein position:absolute; top:xxpx; left:xxpx;

Mit position:absolute verlierst du aber die Breite des Bildschirms wenn das nicht gewollt ist dann kannst du auch mall mit Position:relative; herumspielen.
 
Hallo,

doch noch mal,

mach mal auch ein Bild wo klar wird was du möchtest.
Hier mal ein Bildchen und der code dazu:
111aaa.jpg
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>HabboExplorer &bull; Wartungsmodus</title>
<link rel="shortcut icon" type="image/x-icon" href="./img/favicon.png">
<style type="text/css">@import url('style.css');</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="content-language" content="de" />
<meta name="robots" content="index, follow, noarchive" />
<meta name="description" content="HabboExplorer ist eine Fanseite zum deutschen Habbohotel!" />
<meta name="keywords" content="habboexplorer, habbo, explorer, fanseite, aktuell, infos, hotel, taler, events" />
<style>
body {
 background-image: url('./img/background.png');
 font-family: verdana;
 font-size: 11px;
 background-color: #C6F;
}
a:link, a visited {
color: gray;
}
#dickie {
 /* [disabled]background-image: url('./img/dickie.png'); */
 widht: 197px;
 hight: 321px;
 background-color: #F00;
 position: absolute;
 width: 520px;
 top: -30px;
 left: -8px;
 height: 50px;
 z-index: -5;
}
 
#wrapper {
 width: 503px;
 margin: auto;
 margin-top: 85px;
 background-color: #6FF;
 position: relative;
}
 
 
#top {
 /* [disabled]background-image: url('./img/top.PNG'); */
 width: 503px;
 height: 68px;
 background-color: #CF0;
}
#bar {
 /* [disabled]background-image: url('./img/bar.PNG'); */
 width: 498px;
 height: 18px;
 color: #C00;
 padding-top: 5px;
 padding-left: 5px;
 background-color: #CFF;
}
#main {
background-image: url('./img/main.PNG');
width: 498px;
height: auto;
padding-top: 5px;
padding-left: 5px;
padding-bottom: 5px;
}
#footer {
 /* [disabled]background-image: url('./img/footer.PNG'); */
 width: 498px;
 height: 14px;
 color: #ffffff;
 padding-top: 5px;
 padding-left: 5px;
 background-color: #F0F;
} 
</style>
</head>
<body>
<div id="wrapper">
<div id="dickie"></div>
<div id="top"></div>
<div id="bar"><center>Wir befinden uns derzeit im Wartungsmodus!</center></div> <div id="main">Hallo Habbo,<br />zurzeit befinden wir uns im Wartungsmodus.<br />Bis wir wieder frei zugänglich sind, musst du dich noch ein wenig gedulden!<br /><br />Natürlich suchen wir noch einige Mitarbeiter die uns unterstützen!<br />Wir suchen Techniker,Eventmanager,Community Manager,Infocenter Mitarbeiter und Newsschreiber! Vorraussetzung sind gute Kentnisse und Teamspeak, da wir absofort auf hohe Sicherheit Wert legen!<br />Bewerben kannst du dich unter <a href="mailto:[email protected]">Bewerbung @habboexplorer.de</a><br /><br />Viel Glück wünscht euch<br /><p><b>Die Administration</b></p><br><br></div><div id="footer">&copy HabboExplorer.de ~ -=GlobalLove=-
</div></div>
</body>
</html>

EDIT: ach So
Vorraussetzung sind gute Kentnisse und Teamspeak, da wir absofort auf hohe Sicherheit Wert legen!
Zum Vergrößern anklicken....
ist ja kein Deutsch, das fällt sogar mir auf.
Cheffchen
 
Zuletzt bearbeitet:
Hallo,

hier mal deins mit dem fehlenden div am ende und neus Links Rechts div.
Das Problem ist eigentlich mit css 3 Spalten, geht so nicht.
Entweder mit Javascript die höhe links rechts anpassen oder leider doch Tabellen.
Ausser natürlich die höhe ist fest dann brauchst ja bloss eine höhe angeben.

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>HabboExplorer &bull; Wartungsmodus</title>
<link rel="shortcut icon" type="image/x-icon" href="./img/favicon.png">
<style type="text/css">@import url('style.css');</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="content-language" content="de" />
<meta name="robots" content="index, follow, noarchive" />
<meta name="description" content="HabboExplorer ist eine Fanseite zum deutschen Habbohotel!" />
<meta name="keywords" content="habboexplorer, habbo, explorer, fanseite, aktuell, infos, hotel, taler, events" />
<style>
body {
background-image: url('./img/background.png');
font-family: verdana;
font-size: 11px;
}
a:link, a visited {
color: gray;
}
#dickie {
background-image: url('./img/dickie.png');
widht: 197px;
hight: 321px;
}
 
#wrapper {
width: 703px;
margin: auto;
margin-top: 85px;
}
#mitte{
 width: 503px;
 float:left  
}
#links{
 width: 95px;
 float:left;
 margin-right: 5px;
}
#rechts{
 width: 95px;
 float:left;
 margin-left: 5px;
}
#top {
background-image: url('./img/top.PNG');
width: 503px;
height: 68px;
}
#bar {
background-image: url('./img/bar.PNG');
width: 498px;
height: 18px;
color: #ffffff;
padding-top: 5px;
padding-left: 5px;
}
#main {
background-image: url('./img/main.PNG');
width: 498px;
height: auto;
padding-top: 5px;
padding-left: 5px;
padding-bottom: 5px;
}
#footer {
background-image: url('./img/footer.PNG');
width: 498px;
height: 14px;
color: #ffffff;
padding-top: 5px;
padding-left: 5px;
} 
</style>
</head>
<body>
<div id="dickie"></div>
<div id="wrapper">
<div id="links">
  <p>LINKS</p>
  <p>&nbsp;</p>
</div>
    <div id="mitte">
    <div id="top"></div>
    <div id="bar"><center>Wir befinden uns derzeit im Wartungsmodus!</center></div> <div id="main">Hallo Habbo,<br />zurzeit befinden wir uns im Wartungsmodus.<br />Bis wir wieder frei zugänglich sind, musst du dich noch ein wenig gedulden!<br /><br />Natürlich suchen wir noch einige Mitarbeiter die uns unterstützen!<br />Wir suchen Techniker,Eventmanager,Community Manager,Infocenter Mitarbeiter und Newsschreiber! Vorraussetzung sind gute Kentnisse und Teamspeak, da wir absofort auf hohe Sicherheit Wert legen!<br />Bewerben kannst du dich unter <a href="mailto:[email protected]">Bewerbung @habboexplorer.de</a><br /><br />Viel Glück wünscht euch<br /><p><b>Die Administration</b></p><br><br></div><div id="footer">&copy; HabboExplorer.de ~ -=GlobalLove=-
    </div>
    </div>
 <div id="rechts">
   <p>RECHTS</p>
   <p>&nbsp;</p>
 </div>
</div>
</body>
</html>
Cheffchen
 
Funktioniert leider nicht :(


hatte so eine ähnliche Idee nur wusste ich nciht so recht wie ich diese umsetzen soll, weil alle Versuche fehl geschlagen sind :(
 
Hallo,

Funktioniert leider nicht
Zum Vergrößern anklicken....
ist natürlich eine super Fehlerbeschreibung :O).

Hast mein Code von oben genommen?
Ergebnis ist siehe Bild. LINKS/RECHTS ist ohne Feste höhe, also passt sich hier dem Inhalt an.

Das was oben bei Style steht musst natürlich in deine css Datei reinpacken.

Was bassiert bei Dir da?

Aufzeichnen.JPG
Cheffchen
 
Hallo,

mit halb meinst, nur Linke hälfte vom bild?

Wenn ja ist das klar:

CSS teil den anpassen musst, nicht kopieren, nur das die zeile findest wo was ändern musst:
#wrapper {
width: 703px;
}
#links{
width: 95px;
}
#rechts{
width: 95px;
}

Erklärung:
bei links/rechts sind die je 95 width und 5 luft ja ges 200px, deswegen ist der wrapper jetzt 703, bei dir war der 503 ohne links/rechts.
Wenn das bild was rechts bzw links rein soll 150px breit ist musst die width von 95 auf 150 setzen und den wrapper auch anpassen. (150+5)*2=310+503=813 wrapper.

Cheffchen
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben