Anzeige

Background CSS.. keine Anpassung

Background CSS.. keine Anpassung | PSD-Tutorials.de

Erstellt von LongDonGold, 02.08.2009.

  1. LongDonGold

    LongDonGold The-one-Darksite-of-Life

    Dabei seit:
    17.05.2009
    Beiträge:
    57
    Geschlecht:
    männlich
    Ort:
    Aachen
    Software:
    Cinema 4D, Photoshop Cs3
    Background CSS.. keine Anpassung
    Hallo liebe Community,

    nach wöchentlicher Überlegung, werde ich nun mein Projekt starten.
    Klar in der Hinsicht gibt es schon viele, aber kaum welche für Stämme Logos etc.

    Aber das Problem was ich habe ist der, das er mein Background nicht automatisch anpassen möchte ich verzweifle schon seit 2 Tagen und komme da echt nicht weiter. Das Design ist an dem Webspell-CMS 4.xxx angepasst.

    Hier der HTML Sourcecode:

    Code (Text):
    1. <?php
    2.  
    3. include("_mysql.php");
    4. include("_settings.php");
    5. include("_functions.php");
    6. include("_ipban.php");
    7. include("_sqlpro.php");
    8. include("_referer.php");
    9.  
    10. ?>
    11. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    12. <html xmlns="http://www.w3.org/1999/xhtml">
    13. <head>
    14. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    15. <meta http-equiv="content-language" content="<? echo LANGUAGE; ?>" />
    16. <meta name="description" content="<? echo DESCRIPTION; ?>" />
    17. <meta name="keywords" content="<? echo KEYWORDS; ?>" />
    18. <meta name="author" content="<? echo AUTOR; ?>" />
    19. <meta name="publisher" content="<? echo AUTOR; ?>" />
    20. <meta name="copyright" content="<? echo COPY; ?>" />
    21. <meta name="audience" content="<? echo GRUPPE; ?>" />
    22. <meta name="page-type" content="<? echo TYP; ?>" />
    23. <meta name="page-topic" content="<? echo THEMA; ?>" />
    24. <meta http-equiv="reply-to" content="<? echo MAIL; ?>" />
    25. <meta name="creation_date" content="<? echo date("Y-m-d"); ?>" />
    26. <title><? echo PAGETITLE; ?></title>
    27. <script src="js/prototype.js" type="text/javascript"></script>
    28. <script src="js/scriptaculous.js?load=effects" type="text/javascript"></script>
    29. <script src="js/lightbox.js" type="text/javascript"></script>
    30. <script src="js/bbcode.js" language="JScript" type="text/javascript"></script>
    31. <link href="_stylesheet.css" rel="stylesheet" type="text/css" />
    32. <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
    33. <link rel="stylesheet" href="_art_style.css" type="text/css" />
    34. </head>
    35. <body class="body">
    36. <div class="seite" height="100%">
    37. <div class="headcopy">
    38. <div class="sitenavi">
    39.   <div class="lognavi" align="center"><? include("login.php"); ?>
    40.  
    41.   </div>
    42. </div><div class="menubar" align="center">
    43. <div class="menulinks" align="center"><a href="index.php?site=news">Startseite</a></div>
    44. <div class="menulinks1" align="center"><a href="index.php?site=forum">Forum</a></div>
    45. <div class="menulinks2" align="center"><a href="index.php?site=template">Html Temp</a></div>
    46. <div class="menulinks3" align="center"><a href="index.php?site=cms">Webspell-CMS</a></div>
    47. <div class="menulinks4" align="center"><a href="index.php?site=avatar">Avatare</a></div>
    48. <div class="menulinks5" align="center"><a href="index.php?site=logos">St&auml;mme Logos</a></div>
    49. <div class="menulinks6" align="center"><a href="index.php?site=contact">Kontakt</a></div>
    50. <div class="menulinks7" align="center"><a href="index.php?site=imprint">Impressum</a></div>
    51. </div>
    52. <div class="leftside" align="left">
    53. <div class="lefthead" align="center">Style.Navigation</div>
    54. <a href="index.php?site=uebersicht" />&uuml;bersicht</a><br />
    55. <a href="index.php?site=bottons">Bottons</a><br />
    56. <a href="index.php?site=headers">Headers</a><br />
    57. <a href="index.php?site=avatar">Avatare</a><br />
    58. <a href="index.php?site=logos">St&auml;mme Logos</a><br />
    59. <a href="index.php?site=template">HTML Templates</a><br />
    60. <a href="index.php?site=cms">Webspell-CMS</a><br />
    61. <div class="lefthead" align="center">Com.Navigation</div>
    62. <a href="index.php?site=register">Registrieren</a><br />
    63. <a href="index.php?site=news">News</a><br />
    64. <a href="index.php?site=squads">Unser Team</a><br />
    65. <a href="index.php?site=guestbook">G&auml;stebuch</a><br />
    66. <a href="index.php?site=forum">Forum</a><br />
    67. <a href="index.php?site=polls">Umfragen</a>
    68. <div class="lefthead" align="center">Misc.Navigation</div>
    69. <a href="index.php?site=contact">Kontakt</a><br />
    70. <a href="index.php?site=newsletter">Newletter</a><br />
    71. <a href="index.php?site=partners">Unsere Partner</a><br />
    72. <div class="lefthead" align="center">Statistik<br />
    73. </div>
    74. <div class="leftcontainer">
    75. <p class="counter"><? include ("counter.php"); ?></p></div>
    76. </div>
    77. <div class="contenthead" align="center">Content</div>
    78. <div class="contentmiddle">
    79.         <?php
    80.         if(!isset($site)) $site="news";
    81.         $invalide = array('\\','/','/\/',':','.','<','>',';','[',']','(',')','+');
    82.         $site = str_replace($invalide,' ',$site);
    83.         if(!file_exists($site.".php")){ echo'<h2>Error 404</h2><br>Die von Ihnen angeforderte Datei namens <b>'.$site.'.php</b> ist nicht vorhanden.';
    84.         redirect("index.php?site=news",'',3);
    85.         }
    86.         elseif($acc[$site]>$useracc){
    87.         echo'<h2>Error 403</h2><br>Sie haben nicht die Berechtigung diese Page zu sehen.';
    88.         }
    89.         else include($site.".php");
    90.         ?>
    91. </div>
    92. </div>
    93. </div>
    94. </div><div class="footer" align="center">&copy; Art-of-power powered by <a href="http://3stylers.de" target="_blank">3stylers.de</a> All rights reserved 2009</div>
    95.  
    96. </body>
    97. </html>
    98.  
    Hier der CSS Ressource Code:

    Code (Text):
    1. @charset "utf-8";
    2. .seite {
    3.     width:1024px;
    4.     position:relative;
    5.     height:auto;
    6.     left:20px;
    7.     top: 20px;
    8.     background-repeat: repeat-x;
    9.         background-attachment: fixed;
    10.         background-position:center;
    11.     background-color:#076299;
    12.     border:1px;
    13.     border-left-color:#000000;
    14.     border-left-style:solid;
    15.     border-left-width:thin;
    16.     border-right-color:#000000;
    17.     border-right-style:solid;
    18.     border-right-width:thin;
    19.     border-top-color:#000000;
    20.     border-top-style:solid;
    21.     border-top-width:thin;
    22.     border-bottom-color:#000000;
    23.     border-bottom-style:solid;
    24.     border-bottom-width:thin;
    25.     }
    26. .headcopy {
    27.     background-image:url(pics/Bilder/coyhead.jpg);
    28.     height:200px;
    29.     width:1024px;
    30.     position:relative;
    31.     top:-0px;
    32.     }
    33. .lognavi {
    34.     background-color:#000000;
    35.     width:1024px;
    36.     max-width:300px;
    37.     max-height:auto;
    38.     position:absolute;
    39.     top: 17px;
    40.     left:723px;
    41.     height:148px;
    42. }
    43. .lauftext {
    44.     background-color:#000000;
    45.     color:#ffffff;
    46.     font-family:sans serif;
    47.     font-size:12px;
    48.     font-weight:bold;
    49.     width:722px;
    50.     max-width:722px;
    51.     height:18px;
    52.     position:absolute;
    53.     top: 0px;
    54.     left: 152px;
    55.     height:15px;
    56. }
    57. #alles {
    58.    top: 20px;
    59.    margin:auto;
    60.    position:relative;
    61.    width:1024px;
    62.    }
    63. .menubar {
    64.     background-color:#000000;
    65.     height:20px;
    66.     width:1024px;
    67.     position:absolute;
    68.     background-repeat: repeat-x;
    69.     top:198px;
    70.     left: 0px;
    71. }
    72. .menulinks {
    73.     background-color:#000000;
    74.     height:20px;
    75.     width:100px;
    76.     position:absolute;
    77.     border:1px;
    78.     border-color:#ffffff;
    79.     border-right-style:solid;
    80.      }
    81.  
    82. .menulinks1 {
    83.     background-color:#000000;
    84.     height:20px;
    85.     width:100px;
    86.     position:absolute;
    87.     border:1px;
    88.     border-color:#ffffff;
    89.     border-right-style:solid;
    90.     left:101px;
    91.      }
    92. .menulinks2 {
    93.     background-color:#000000;
    94.     height:20px;
    95.     width:100px;
    96.     position:absolute;
    97.     border:1px;
    98.     border-color:#ffffff;
    99.     border-right-style:solid;
    100.     left:202px;
    101.      }
    102. .menulinks3 {
    103.     background-color:#000000;
    104.     height:20px;
    105.     width:100px;
    106.     position:absolute;
    107.     border:1px;
    108.     border-color:#ffffff;
    109.     border-right-style:solid;
    110.     left:303px;
    111.      }
    112. .menulinks4 {
    113.     background-color:#000000;
    114.     height:20px;
    115.     width:100px;
    116.         position:absolute;
    117.     border:1px;
    118.     border-color:#ffffff;
    119.     border-right-style:solid;
    120.     left:404px;
    121.      }
    122. .menulinks5 {
    123.     background-color:#000000;
    124.     height:20px;
    125.     width:100px;
    126.     position:absolute;
    127.     border:1px;
    128.     border-color:#ffffff;
    129.     border-right-style:solid;
    130.     left:505px;
    131.      }
    132. .menulinks6 {
    133.     background-color:#000000;
    134.     height:20px;
    135.     width:100px;
    136.     position:absolute;
    137.     border:1px;
    138.     border-color:#ffffff;
    139.     border-right-style:solid;
    140.     left:606px;
    141.      }
    142. .menulinks7 {
    143.     background-color:#000000;
    144.     height:20px;
    145.     width:100px;
    146.     position:absolute;
    147.     border:1px;
    148.     border-color:#ffffff;
    149.     border-right-style:solid;
    150.     left:707px;
    151.      }
    152. .leftside {
    153.     background-color:#000000;
    154.     max-width:150px;
    155.     position:absolute;
    156.     max-height:auto;
    157.     top:218px;
    158.     color:#ffffff;
    159.     font-size:10px;
    160.     font-family:sans-serif;
    161.     }
    162. .lefthead {
    163.     background-image:url(pics/Bilder/navleft.jpg);
    164.     height:25px;
    165.     width:150px;
    166.     max-width:150px;
    167.     color:#ffffff;
    168.     font-family:sans-serif;
    169.     font-size:12px;
    170.     font-weight:bold;
    171.     vertical-align:baseline;
    172.     }
    173. .leftcontainer {
    174.     background-color:#000000;
    175.     max-height:auto;
    176.     width:150px;
    177.     max-width:150px;
    178.     color:#ffffff;
    179.     font-family:sans-serif;
    180.     font-size:12px;
    181.     position:absolute;
    182.     }
    183. .contenthead {
    184.     height:25px;
    185.     width:874px;
    186.     max-weight:874px;
    187.     background-image:url(pics/Bilder/navleft.jpg);
    188.     background-repeat:repeat-x;
    189.     color:#ffffff;
    190.     font-family:sans-serif;
    191.     font-size:12px;
    192.     top:218px;
    193.     left:150px;
    194.     position:absolute;
    195.     }
    196. .contentmiddle {
    197.     max-height:auto;
    198.     border:1px;
    199.     border-left-style:solid;
    200.     border-left-width:thin;
    201.     border-left-color:#000000;
    202.     border-bottom-color:#000000;
    203.     border-bottom-style:solid;
    204.     border-bottom-width:thin;
    205.     width:874px;
    206.     background-repeat:repeat-y;
    207.     top:26px;
    208.     color:000000;
    209.     font-size:8px;
    210.     font-family:sans-serif;
    211.     position:absolute;
    212.     }
    213. .counter {
    214.     font-size:12px;
    215.     max-width:150px;
    216.     color:#ffffff;
    217.     font-family:sans-serif;
    218. }
    219. .footer {
    220.     height:20px;
    221.     width:1024px;
    222.     border:1px;
    223.     border-left-style:solid;
    224.     border-left-width:thin;
    225.     border-left-color:#000000;
    226.     border-bottom-color:#000000;
    227.     border-bottom-style:solid;
    228.     border-bottom-width:thin;
    229.     border-right-style:solid;
    230.     border-right-width:thin;
    231.     border-right-color:#000000;
    232.     position:relative;
    233.     background-color:#076299;
    234.     left:20px;
    235.     }
    Natürlich darf der Link zur Seite auch nicht Fehlen:

    webSPELL4.01.02net [webspell-cms.net]

    Wenn ich die height angabe mit Pixel eintrage ist es kein Problenm, aber sonst anderes nimmt er nicht.

    Vielen Dank für Eure hilfe.

    LG LDG
     
    #1      
  2. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    Background CSS.. keine Anpassung
    AW: Background CSS.. keine Anpassung

    welchen hintergrund für welchen Bereich meinst du?
    Da gibts ein paar mehr Problemeals nur ein hintergrund. Dein Footer scheint da im Kopfbereich der Seite auch ungünstig zu stehen.

    Es wäre günstiger die Element im Dokumentenfluss zu lassen, statt soviel mit absoluten Positionierungen zu machen
     
    Zuletzt bearbeitet: 02.08.2009
    #2      
  3. LongDonGold

    LongDonGold The-one-Darksite-of-Life

    Dabei seit:
    17.05.2009
    Beiträge:
    57
    Geschlecht:
    männlich
    Ort:
    Aachen
    Software:
    Cinema 4D, Photoshop Cs3
    Background CSS.. keine Anpassung
    AW: Background CSS.. keine Anpassung

    Könntest du mir genauer sagen was du damit meinst?

    Weil weil ich bei der css Angabe .seite die height Angabe mache geht der Background mit aber wenn ich das als auto oder repeat-x mache, bewegt nicht nichts.
     
    #3      
  4. LongDonGold

    LongDonGold The-one-Darksite-of-Life

    Dabei seit:
    17.05.2009
    Beiträge:
    57
    Geschlecht:
    männlich
    Ort:
    Aachen
    Software:
    Cinema 4D, Photoshop Cs3
    Background CSS.. keine Anpassung
    AW: Background CSS.. keine Anpassung

    Das Thema kann geschlossen werden, da ich den Fehler selbst gefunden habe.

    Das Problem lag a der Position, dem Float und den Div Tags.

    Danke für die zahlreichen Antworten.

    *close* bitte*
     
    #4      
Seobility SEO Tool
x
×
×