Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag25.06.2009 um 06:09 (UTC)    
Titel: Content in vordergund stellen

hallo ich bins DJ Hazard,

ich arbeite grad mal aus langer weile an nem Designe und hab mal ne frage wie kann ich es machen das der Content über den anderen lage liegt und nicht drunter...dabei muss er aber also margin: 0 auto; bleiben damit ers sich automatisch mitscrollt...

ich will das die Kanten vom träger offen bleiben wie über all aber dadurch das der tiefer sitzt als die navi funktioniert das nicht...


codes[
Code:
#pre_content{display:none}
#pre_header{display:none}
#post_header{display:none}
#below_content{display:none}
#extraDiv2{display:none}
#extraDiv3{display:none}
#extraDiv4{display:none}
#extraDiv5{display:none}
#extraDiv6{display:none}
div.header{display:none}
#nav_container{display:none}


body{
background-color:#4b483b;
background-image:url();
text-align:center}


*{ padding: 0; margin: 0 auto; }


td{
text-align:left}


a{color :#000000;text-decoration :none}
a:hover{color :#63703F;text-decoration :none}
a:active{color :#63703F;text-decoration :none}


#header_container{
position:absolute;
top:45px;
left:50%;
margin-left:-481px;
width:962px;
height:293px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u-header.png);
border:0px solid #c9c9c9}


h2#title{
position:static;
width:540px;
height:25px;
margin-top:0px;
padding-top:11px;
margin-left:-55px;
font-weight:bold;
font-size:18px;
font-family:verdana;
color:#000000;
text-align:center;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_content_top.png);
border:0px solid #FFFFFF;}


#content{
margin: 0 auto;
margin-top:311px;
left:50%;
width:430px;
padding-left:55px;
padding-right:55px;
height:-px;
color:#000000;
font-size:12px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_content_ground.png);
border:0px solid #FFFFFF;
overflow:none}


#post_content{
margin: 0 auto;
left:50%;
width:540px;
padding-left:0px;
padding-right:0px;
height:98px;
color:#000000;
font-size:12px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_content_bottom.png);
border:0px solid #FFFFFF;
overflow:none}


#nav1{
position:absolute;
left:50%;
top:337px;
margin-left:-481px;
width:242px;
height:201px;
padding-bottom:0px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_ground.png)}


#nav1_header{
position:absolute;
left:50%;
top:337px;
margin-left:-448px;
width:175px;
height:33px;
padding-top:6px;
font-weight:bold;
font-size:18px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_heading.png)}


#nav1_1 a{
position:absolute;
margin:0 auto;
top:376px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav1_1 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav1_2 a{
position:absolute;
margin:0 auto;
top:419px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav1_2 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav1_3 a{
position:absolute;
margin:0 auto;
top:462px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav1_3 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav2{
position:absolute;
left:50%;
margin:0 auto;
top:538px;
margin-left:-481px;
width:242px;
height:201px;
padding-bottom:0px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_ground.png)}


#nav2_header{
position:absolute;
left:50%;
top:538px;
margin-left:-448px;
width:175px;
height:33px;
padding-top:6px;
font-weight:bold;
font-size:18px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_heading.png)}


#nav2_1 a{
position:absolute;
margin:0 auto;
top:577px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav2_1 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav2_2 a{
position:absolute;
margin:0 auto;
top:620px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav2_2 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav2_3 a{
position:absolute;
margin:0 auto;
top:663px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav2_3 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav3{
position:absolute;
left:50%;
margin:0 auto;
top:739px;
margin-left:-481px;
width:242px;
height:201px;
padding-bottom:0px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_ground.png)}


#nav3_header{
position:absolute;
left:50%;
top:739px;
margin-left:-448px;
width:175px;
height:33px;
padding-top:6px;
font-weight:bold;
font-size:18px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_heading.png)}


#nav3_1 a{
position:absolute;
margin:0 auto;
top:778px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav3_1 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav3_2 a{
position:absolute;
margin:0 auto;
top:821px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav3_2 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav3_3 a{
position:absolute;
margin:0 auto;
top:864px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav3_3 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav4{
position:absolute;
left:50%;
margin:0 auto;
top:940px;
margin-left:-481px;
width:242px;
height:201px;
padding-bottom:0px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_ground.png)}


#nav4_header{
position:absolute;
left:50%;
top:940px;
margin-left:-448px;
width:175px;
height:33px;
padding-top:6px;
font-weight:bold;
font-size:18px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_heading.png)}


#nav4_1 a{
position:absolute;
margin:0 auto;
top:979px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav4_1 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav4_2 a{
position:absolute;
margin:0 auto;
top:1022px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav4_2 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav4_3 a{
position:absolute;
margin:0 auto;
top:1065px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav4_3 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav5{
position:absolute;
left:50%;
margin:0 auto;
top:1141px;
margin-left:-481px;
width:242px;
height:201px;
padding-bottom:0px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_ground.png)}


#nav5_header{
position:absolute;
left:50%;
top:1141px;
margin-left:-448px;
width:175px;
height:33px;
padding-top:6px;
font-weight:bold;
font-size:18px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_heading.png)}


#nav5_1 a{
position:absolute;
margin:0 auto;
top:1180px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav5_1 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav5_2 a{
position:absolute;
margin:0 auto;
top:1223px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav5_2 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#nav5_3 a{
position:absolute;
margin:0 auto;
top:1266px;
margin-left:-448px;
left:50%;
width:175px;
height:38px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:16px;
font-family:verdana;
color:#000000;
text-align:center;
border:0px solid #343434;
background-color:#8A0000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_button.png)}


#nav5_3 a:hover{
color:#000000;
padding-top:5px;
width:175px;
height:38px;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_hover.png)}


#post_nav{
position:absolute;
margin:0 auto;
top:1342px;
margin-left:-481px;
left:50%;
width:242px;
height:31px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/u_nav_bottom.png)}


#sidebar_heading{
position:static;
width:178px;
height:22px;
margin-top:0px;
padding-top:5px;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
font-size:13px;
font-family:verdana;
color:#ffffff;
text-align:center;
background-color:#000000;
background-image:url(http://img.webme.com/pic/h/hazard-test/sidebar_header.png);
border:0px solid #FFFFFF;}


#sidebar_container
{position:absolute;
left:50%;
top:224px;
margin-left:272px;
margin-bottom:0px;
width:178px;
height:auto;
background-image:url(http://img.webme.com/pic/h/hazard-test/sidebar_ground.png);
background-repeat:repeat;
border:0px solid #ffffff;
text-align:center;
font-size:11px;
font-family:verdana;
color:#000000;
overflow:none}


#post_sidebar{
position:absolute;
margin:0 auto;
top:700px;
margin-left:272px;
left:50%;
width:178px;
height:13px;
border:0px solid #343434;
background-image:url(http://img.webme.com/pic/h/hazard-test/sidebar_footer.png)}


#unsichbar{
position:absolute;
margin:0 auto;
top:20px;
margin-left:10px;
width:1000px;
height:10px;
border:0px solid #343434;
background-color:transparent;
background-image:url()}




Es geht um meine die HP hazard-test.de.tl


Edit: der einzige Link der zu testzwecken geht ist in Navigation Über uns
______________
Musik mit Klang: http://dj-hazard.de.tl


Zuletzt bearbeitet von hazard-test am 25.06.2009, 07:18, insgesamt einmal bearbeitet
Beitrag25.06.2009 um 19:54 (UTC)    
Titel:

Verwende einfach z-index.
So kannst du genau festlegen ob dieser Layer jetzt unten drunter oder ganz oben ist.

Hier ein kleines simples Beispiel dafür:



Code:
#Hintergrund {
  position: absolute;
  left: -36px;
  top: +0px;
  height: 100%;
  z-index: 1;
  background:url(bg.jpg) ; }


#Content {
  position: absolute;
  left: 61px;
  top: 83px;
  width: 951px;
  height: 900px;
  z-index: 2;
background:url(content.jpg) no-repeat; }


Gruss, Yannick
______________
WebDesign | Corporate Design | Redesign



Zuletzt bearbeitet von nuo-designs am 25.06.2009, 20:55, insgesamt 2-mal bearbeitet
Beitrag26.06.2009 um 08:14 (UTC)    
Titel:

hat nicht funktioniert...ka warum...aber ist auch egal ich lass des jetzt so...

trotzdem danke...
______________
Musik mit Klang: http://dj-hazard.de.tl
Beiträge der letzten Zeit anzeigen:   


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