hintergrund

  • hallo alle miteinander

    ich versuche schon seit tagen den grauen hintergrundbalken meiner webseite zu vergrößern sprich: die höhe. siehe url http://www.dialog-marketingservices.de/index.html

    es müsste am body machbar sein aber ich finde es einfach nicht !


    für profis wie euch kein problem nehme ich an.

    hier noch einige hilfen:

    danke im voraus


    <!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>DIALOG MARKETING SERVICES</title>

    <meta http-equiv="content-type" content="text/html; charset=utf-8"></meta>
    <meta http-equiv="content-language" content="cs"></meta><meta content="" name="author" lang="cs"></meta><meta content="" name="copyright" lang="cs"></meta><meta content="..." name="description"></meta><meta content="..." name="keywords"></meta><meta content="all,follow" name="robots"></meta><link media="screen,projection" href="css/screen.css" type="text/css" rel="stylesheet"></link><link media="print" href="css/print.css" type="text/css" rel="stylesheet"></link><!-- Layout stránek -->
    </head><body><div id="layout"><!-- Hlavička -->
    <div id="header">
    <h1 class="ZEditableArea ZContentType_logo" id="logo"><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><a href="./" class="" title="Nature Theme"><span style="font-size: 20px; line-height: 20px;"><span style="font-size: 48px; line-height: 48px;"><span style="font-size: 72px; line-height: 72px;"> </span><span style="font-size: 75px; line-height: 48px;"><span style="font-size: 72px; line-height: 72px;"> </span><span style="font-size: 48px; line-height: 48px;"><span style="font-size: 72px; line-height: 72px;"><span style="font-size: 48px; line-height: 48px;"></span></span><span style="font-size: 48px; line-height: 48px;"><span style="font-size: 72px; line-height: 72px;"><span style="font-size: 48px; line-height: 48px;"><b><span style="font-size: 28px; line-height: 28px;"></span></b><span style="font-size: 8px; line-height: 8px;"><span style="font-size: 16px; line-height: 16px;"><span style="font-size: 22px; line-height: 22px;"></span></span></span></span></span></span></span></span></span></span></a></h1>
    <hr class="noscreen" />
    <!-- Rychlá navigace -->
    <p class="noscreen noprint"><em>Rychlá navigace: <a href="#obsah" class="">obsah</a>, <a href="#nav" class="">navigace</a>.</em> </p></div><!-- end/ Hlavička -->
    <hr class="noscreen" />
    <!-- Hlavní navigace -->
    <div class="box" id="nav">
    <ul class="mainMenuLi"><li class="activeLi ZrootPage"><a target="_top" href="index.html" class="activeA ZrootPage">Αρχική σελίδα</a></li><li><a target="_top" href="h_eteria.html">Η εταιρία</a></li><li><a target="_top" href="filosofia.html">Φιλοσοφία</a></li><li><a target="_top" href="pleonektimata.html">Πλεονεκτήματα</a></li><li><a target="_top" href="poiothta.html">Ποιότητα</a></li><li><a target="_top" href="epikinonia.html">Επικοινωνία</a></li></ul>
    <hr class="noscreen" />
    </div><!-- end/ Hlavní navigace -->


    <div class="box" id="container"><!-- Obsah stránek-->
    <div id="intro">
    <div class="ZEditableArea ZContentType_leadContent" id="intro-in"><p class="intro"><img style="width: 890px; height: 114.485px;" src="Z-pictures/startseite_08.jpg" alt="" vspace="0" hspace="0" /></p></div></div>

    <div class="box" id="container2"><!-- Obsah stránek-->
    <div id="intro2">
    <div class="ZEditableArea ZContentType_leadContent" id="intro-in2">
    <h2><b><span style="font-size: 28px; line-height: 28px;"><span style="font-size: 24px; line-height: 24px;"></span></span></b></h2>
    <p class="intro2"><span style="font-size: 22px; line-height: 22px;"><span style="font-size: 24px; line-height: 24px;"><b><u><u></u><br/><u></u></u>Καλωσορίσατε στην ιστοσελίδα μας!</b></span></span><b></b><br/><br/>Το αντικείμενο της DMS είναι η διαφήμιση με ένα συγκεκριμένο και μοναδικό τρόπο.<br/>Πιο αναλυτικά δίνει τη δυνατότητα σε κάθε εταιρία, οργανισμό ή ελεύθερο επαγγελματία που απευθύνεται στη λιανική να αποκτήσει πρόσβαση σε χώρους μαζικής προσέλευσης και εστίασης καταναλωτικού κοινού που αποτελεί και την αγοραστική δύναμη.<br/>Τέτοιοι χώροι είναι μεγάλες αλυσίδες super market και hyper market όπως,<br/>Carrefour Μαρινόπουλος , Μασούτης , Βερόπουλος , Γαλαξίας Ατλάντικ κ.α.<br/>Ο τρόπος με τον οποίο δίνει αυτή τη δυνατότητα είναι η έγχρωμη εκτύπωση της επιχείρησης πίσω από την απόδειξη που παίρνει ο καταναλωτής για τις αγορές του.<br/>Μπορούμε με αυτό τον τρόπο να γνωστοποιήσουμε την επιχείρηση σας σε χιλιάδες καταναλωτές σε τοπικό αλλά και πιο διευρυμένο επίπεδο.<br/>Μπορούμε να δημιουργήσουμε την προύπόθεση να επισκεφθούν την επιχείρηση παλιοί και νέοι πελάτες κάνοντας την καταχώρηση πίσω από την απόδειξη και κουπόνι (με πραγματική προσφορά),λεφτά στην τσέπη του καταναλωτή κίνητρο ικανό για να επισκεφτεί την συγκεκριμένη εταιρία.<u><br/></u></p></div></div>


    <div class="ZEditableArea ZContentType_leadContent" id="intro-in3">
    <h2><u> </u> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<img style="width: 201px; height: 420.979px;" src="Z-pictures/kassenbon_start.gif" alt="" vspace="0" hspace="0" /><u></u><br/></h2>

    <div class="clear"></div>
    </div>


    <div class="shadow ZEditableArea ZContentType_footer" id="footer">
    <div class="f-left"><u>Copyright © 2009 <a href="#" class="">DIALOG MARKETING SOLUTIONS</a></u></div>
    <div class="f-right"><u>Designed by <a href="http://www.dialog-marketingservices.de" class="">Triantafyllos Lazaridis</a></u></div></div></div><!-- end/ Layout stránek -->
    <script src="http://client.zimplit.com/users/publicUser_v3/jquery.js" type="text/javascript"></script><script src="http://client.zimplit.com/users/publicUser_v3/ZimgZoomer.js" type="text/javascript"></script><script src="Zmenu.js?t=333948" type="text/javascript"></script><script src="http://client.zimplit.com/users/publicUser_v3/ZZMenu.js" type="text/javascript"></script></div></div></body></html>


    und css:
    * { margin:0; padding:0; }
    body, div, span, p, a, img, ul, ol, li, table, th, tr, td, form, fieldset, legend, dl, dt, dd, blockquote, applet, object { border:0; }
    body {
    padding: 10px;
    background: #fff url("../img/bg.jpg") repeat-x;
    font: 0.8em/1.5 "arial",sans-serif;
    color: #354146;
    text-align: center;
    }

    /* obecne odkazy --------------------------------------------------------------- */
    a {color:#1666a3;}
    a:link {color:#1666a3;}
    a:hover {color:#0b4775;}

    /* nadpisy --------------------------------------------------------------------- */
    h1, h2, h3, h4, h5, h6 { margin: 20px 56px auto; }
    h1 { font-size:5%; font-family: Georgia;}
    h1#logo a{color: #ced1d2; text-decoration: none; display: block;padding: 0px 0 17px; font-weight: normal;}
    h1#logo a:hover{color: #fff;}
    h1 {width:890px;}
    h2 { font-size:130%; color: #354146;font-weight: bold; padding: 0;margin:0; text-decoration:none;}
    h3 { font-size:120%; }
    h4 { font-size:120%; }
    h5 { font-size:100%; }

    /* layout ---------------------------------------------------------------------- */
    #layout {

    text-align:left;
    }
    #container { clear: both;

    }
    #intro {
    background : #e6e8e9;
    height : auto;
    width : 890px;
    margin-top : 0;
    margin-left :56px;
    margin-bottom : 0;
    margin-right : 0;
    }
    #intro-in {
    width : 890px;
    margin-top : 0;
    margin-left : 0;
    margin-bottom : 0;
    margin-right : 0;
    padding : 20px 0;
    }

    #container2 { clear: both;

    }
    #intro2 {
    background : #fff;
    height : auto;
    width : 445px;
    margin-top : 0;
    margin-left : 56px;
    margin-bottom : 0;
    margin-right : 0;
    }
    #intro-in2 {
    width : 445px;
    padding : 0;
    margin-top : 0;
    margin-left : 0;
    margin-bottom : 0;
    margin-right : 0;
    float : left;
    }

    #container3 { clear: both;

    }
    #intro3 {
    background : #e6e8e9;
    height : auto;
    width : 445px;
    margin-top : 0;
    margin-left : 0;
    margin-bottom : 0;
    margin-right : 0;
    padding : 0;

    }

    #intro-in3 {
    width : 445px;
    padding : 0;
    margin-top : 0;
    margin-left : 0;
    margin-bottom : 0;
    margin-right : 0;
    float : right;

    }


    /* hlavicka ------------------------------------------------------------------ */
    #header {
    width :100px;
    margin-top : 100;
    margin-left : 0;
    margin-bottom : 0;
    margin-right : 0;
    }


    /* horizontalni navigace --------------------------------------------------- */
    #nav {width:890px;
    margin: 0 auto;}
    #nav ul {margin:0; padding:0; list-style:none;height: 35px;}
    #nav ul li {float:left; display:block; margin:0; padding:0;}
    #nav ul li a {
    display: block;
    float: left;
    font-size: 100%;
    color: #ff00ff;
    text-decoration: none;
    padding: 5px 30px 10px;
    text-align: center;

    }
    #nav ul li a:hover {
    color: #ced1d2;
    text-decoration: none;
    }
    #nav ul li#active a, body .activeA {
    color: #101517;
    border: 1px solid #fff;border-bottom:1px solid #e6e8e9;
    background:#e6e8e9; text-decoration: none;
    margin: 0 auto;}


    .content {
    padding: 0 0 0 0;
    z-index: 10;
    width:890px;
    margin:0 auto;
    text-decoration: none;
    }
    .content .in{
    padding: 20px 0 30px;
    text-decoration: none;
    }
    p.intro{
    background: #e6e8e9;height: auto;
    line-height: 23px;
    margin:0 0 0;
    }
    .shadow {
    border-top : 1px solid #dddddd;
    padding : 10px 0;
    background : url("../img/shadow.jpg") no-repeat;
    margin-top : 1px;
    margin-left : 56px;
    margin-bottom : 0;
    margin-right : 0;
    color : #ff00ff;
    }
    img.thumb{padding: 3px; background: #fff; border: 1px solid #d1d1d1;}

    .columns {list-style: none;margin:10px 0 0 0;padding:0; font-size: 90%;}
    .columns li{float: left; width: 100%;}
    .columns li.col2{border-left: 1px solid #d7d7d7;border-right: 1px solid #d7d7d7;}
    .columns li h3{padding: 0 10px;color: #2e4650; margin: 0 0 5px;}
    .columns li.col2 h3{padding-left: 20px;}
    .columns li.col3 h3{padding-left: 20px;}
    .columns li p{line-height: 22px;padding: 0 20px 0 10px; margin: 0; color: #3f4345;}
    .columns li.col2 p{padding: 0 20px 0 20px;}
    .columns li.col3 p{padding: 0 10px 0 20px;}
    .columns li a.more{display: block;color: #1666a3;padding: 5px 0;}
    .columns li a.more:hover{color: #0b4775; text-decoration: none;}



    /* paticka ----------------------------------------------------------------- */
    #footer {
    width : 890px;
    margin-top : 0;
    margin-left : 56px;
    margin-bottom : 0;
    margin-right : 0;
    clear : both;
    font-size : 85%;
    padding-bottom : 70px;
    color : #ff00ff;
    }
    #footer a{color: #ff00ff;}
    #footer a:hover{color: #ff00ff; text-decoration: none;}
    #footer .f-left, #footer .f-right { padding: 0 10px; }


    /* odstavce -------------------------------------------------------------------- */
    p { margin:15px 0; }

    /* tabulky --------------------------------------------------------------------- */
    table { margin:15px 0; border-collapse:collapse; border-spacing:0; font-size:100%; }
    th { text-align:center; font-weight:bold; }
    th, td { padding:3px 5px; }

    /* seznamy --------------------------------------------------------------------- */
    ul, ol { display:block; margin:15px 0 15px 40px; }
    ul ul, ul ul ul, ol ol, ol ol ol { margin:0; margin-left:20px; }
    ol { list-style-type:decimal; }
    ol ol { list-style-type:upper-alpha; }
    ol ol ol {list-style-type:lower-alpha; }
    li { display:list-item; }
    ul li a { text-decoration: none; }

    /* definice -------------------------------------------------------------------- */
    dl { margin:15px 0; }
    dt { font-weight:bold; }
    dd { margin-left:30px; }

    /* ostatni --------------------------------------------------------------------- */
    fieldset { margin:15px 0; padding:10px; border:1px solid #CCC; }
    legend { margin-left:10px; font-size:100%; font-weight:bold; color:#000; }
    abbr, acronym, .help { border-bottom:1px dotted #CCC; cursor:help; }
    blockquote { margin:15px 20px; font-style:italic; }
    del, .del { text-decoration: none; }
    strong, .strong { font-weight:bold; }
    cite, em, q, var { font-style:italic; }
    code, kbd, samp {font-family:monospace; font-size:110%; }
    hr { display:block; height:1px; margin:10px 0; padding:0; border:0 solid #CCC; background:#CCC; color:#CCC;}
    .f-left {float:left;}
    .f-right {float:right;}
    .a-left, tr.a-left td {text-align:left;}
    .a-center, tr.a-center td {text-align:center;}
    .a-right, tr.a-right td {text-align:right;}
    .a-justify {text-align:justify;}
    .va-top {vertical-align:top;}
    .va-middle {vertical-align:middle;}
    .va-bottom {vertical-align:bottom;}
    .clear { clear:both; }
    .box { min-height:1px; }
    .box:after { display:block; visibility:hidden; clear:both; line-height:0; font-size:0; content:"."; }
    .noscreen { display:none; }
    .mleft10 { margin-left: 10px; }
    .mright10 { margin-right: 10px; }
    .mtop10 { margin-top: 10px; }
    .mbottom10 { margin-bottom: 10px; }

    /* univerzalni prvky ------------------------------------------------------------ */
    input.small{
    width: 50px;
    }
    input.normal{
    width: 146px;
    }
    .bigger {font-size:115%;}
    .smaller {font-size:85%;}

    .high {color:#00F;}
    .nonhigh {color:#777;}

    .foto{ display: block; border: 3px solid #ddd;}


  • und hier noch die style.css


    body, h1, h2, h3, p, ul {margin: 0; padding: 0;}
    body {background-color: #eee;}
    img {border: none;}

    div#framework {margin: 20px; width: 970px; background-color: #fff;}
    div#logo {position: absolute; left: 70px; top: 235px; z-index: 2; padding: 5px 0 10px 0; font-size: 40px; font-family: Klavika, 'Trebuchet ms', sans; font-weight: normal; color: #ffffff;}
    div#container {margin: 0 20px 0 20px; font-family: Tahoma, sans; color: #504838;}
    div#content {font-size: 16px; line-height: 20px;}
    div#content a {color: #b90000;}
    div#content a:hover {color: #fff; background-color: #b90000; text-decoration: none;}
    #content h1 {padding: 10px 0 15px 0; font-size: 32px; font-family: Klavika, 'Trebuchet ms', sans; font-weight: normal; color: #bd0000;}
    #content h2 {padding: 5px 0 10px 0; font-size: 20px; line-height: 30px; font-weight: normal;}
    #content h3 {padding: 5px 0 10px 0; font-size: 40px; font-family: Klavika, 'Trebuchet ms', sans; font-weight: normal; color: #bd0000;}
    div#footer {line-height: 14px; margin-top: 5px; clear: both; background: url('../images/jalus-tst.png') repeat-y;}
    #footer p {font-size: 11px; padding: 5px 20px 5px 30px;}

    div.menu {height: 42px; background-color: #e50000; color: #fff;}
    ul.mainmenu {font-size: 16px; margin-left: 24px; float: left;}
    .mainmenu li {float: left; padding-right: 4px; display: inline;}
    .mainmenu a {float: left; padding: 10px 8px 0 8px; color: #fff; text-decoration: none; height: 32px;}
    .mainmenu a:hover {background-color: #b70000;}
    .mainmenu a.activeA {color: #fff; background: url('../images/menyy-esi-aktiivne-tst.png') repeat-x; padding-left: 5px;}
    ul.langmenu {font-size: 9px; padding-top: 15px; margin-right: 20px; float: right;}
    .langmenu li {float: left; text-transform: uppercase; padding-right: 4px; display: inline;}
    .langmenu a {color: #fff; text-decoration: none; padding: 4px;}
    .langmenu a:hover {color: #b70000; background-color: #fff;}
    .langmenu a.activeA{color: #fff; background-color: #b70000;}
    div.intro {padding: 20px 30px 5px 30px; line-height: 28px; clear: both; font-size: 14px;
    background: #aca994 url('../images/intro-esi-tst.png') repeat-x;}
    div.intro p {padding-bottom: 10px;}
    div.intro img.illustration {margin: 5px 0 5px 15px; float: right; border: solid 3px #bbb7ae;}

    div.subpage {}
    div.subpage img.logo {padding: 34px 0 10px 30px;}
    div.subpage div.menu {background: #e50000 url('../images/menyy-sisu-tst.png') no-repeat;}
    div.subpage div.intro {padding-bottom: 0px; background: #f1f1ea url('../images/intro-sisu-tst.png') no-repeat; margin-bottom: 10px;}
    div.subpage div.intro img.system {margin-left: -30px; padding-top: 10px;}
    div.subpage div.intro p {min-height: 50px; font-size: 14px; line-height: 20px;}
    div.subpage ul.mainmenu a.active {background: url('../images/menyy-sisu-aktiivne-tst.png') repeat-x;}
    div.subpage div#footer {margin-top: 15px;}
    div.submenu {height: 40px;}
    ul.submenu {font-size: 12px; padding: 15px 0 0 30px; float: left;}
    .submenu li {float: left; display: inline; padding-right: 8px;}
    .submenu a {padding: 2px 4px 2px 4px; color: #bd0000; text-decoration: underline;}
    .submenu a:hover, .submenu a.active {color: #fff; background-color: #b70000; text-decoration: none;}
    div.block {padding: 10px 20px 0 20px; clear: both;}
    .block img {float: left; margin: 0 20px 10px 0; border: solid 3px #bbb7ae;}
    .block li {float: left; display: inline; padding: 10px 5px 0 0; font-size: 20px;}
    .block li img {border: none; margin: 0;}
    .block li.number {font-size: 20px; margin: 5px 0 0 5px; width: 40px;}
    .block li.text {font-size: 14px; font-weight: bold; margin: 5px 0 0 5px;}
    .block a:hover img {border-color: #b70000;}

    img.system {display: block;}
    div.gallery {z-index: 4; position: absolute; top: 50px; left: 0; text-align: center; width: 100%;}
    div.gallery img {border: solid 3px #fff;}
    div.gallery a:hover img {border-color: #b70000;}
    #screen {z-index: 3; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #aca994;
    opacity: 0.7; -moz-opacity: 0.7; filter: alpha(opacity=70;}

  • 1. Benutze doch mal die [ HTML ] Tags;)
    2. In deiner css bei

    Code
    body {
    padding: 10px;
    [B]background: #fff url("../img/bg.jpg") repeat-x;[/B]
    font: 0.8em/1.5 "arial",sans-serif;
    color: #354146;
    text-align: center;
    }

    Das Hintergrundbild (http://www.dialog-marketingservices.de/img/bg.jpg) mit einem Photoprogramm öffnen und einfach die Höhe so anpassen wie du es haben willst:)

  • 1. Benutze doch mal die [ HTML ] Tags;)
    2. In deiner css bei

    Code
    body {
    padding: 10px;
    [B]background: #fff url("../img/bg.jpg") repeat-x;[/B]
    font: 0.8em/1.5 "arial",sans-serif;
    color: #354146;
    text-align: center;
    }

    Das Hintergrundbild (http://www.dialog-marketingservices.de/img/bg.jpg) mit einem Photoprogramm öffnen und einfach die Höhe so anpassen wie du es haben willst:)


    danke für deine antwort


    hmmm hatte auch schon daran gedacht nur habe ich das problem das ich die datei nicht in den zimplit dateieordner bekomme ! dashatman wohl davon wenn man mit so programmen arbeitet!

    siehst du sonst noch eine möglichkeit das ganze zu strecken ??