Ragnaroek
Account gelöscht Threadersteller
Ort: -
|
Verfasst Mi 25.10.2006 10:31
Titel [css] 100%-Problem |
  |
|
Guten Morgen allerseits...
Ich sitze gerade an dieser Webseite:
Entwurf
und habe damit foldendes Problem:
Die grauen "Rahmen" an den Seiten bestehen aus einem 1 Px hohen GIF, was immer wiederholt wird. Jetzt möchte ich das ganze gerne so machen dass je nach Browsergröße die Rahmen bis zum unteren Bildschirmrand gehen. Bei Tabellen brauchte ich die Höhe damals nur auf 100% setzen. Wie verhält sich das bei css?
Könnte mir da evt jemand einen Tipp geben?
Hier noch der Code der Seite:
| Code: | <body>
<div id="container_main">
<div id="header">
</div>
<div id="content_main">
<div id="nav_links">
<div id="content_nav_leiste">
Startseite
</div>
<div id="content_nav_leiste">
Company
</div>
<div id="content_nav_leiste">
Produkt
</div>
<div id="content_nav_leiste">
Preise
</div>
<div id="content_nav_leiste">
Referenzen
</div>
<div id="content_nav_leiste">
Impressum
</div>
<div id="content_nav_leiste">
Sitemap
</div>
</div>
<div id="nav_rechts">
<div id="login">
<form>
<label for="benutzername">Benutzername:</label>
<input name="benutzername" id="benutzername" type="text" class="textfeld"/>
<label for="kennwort">Kennwort:</label>
<input name="kennwort" id="kennwort" type="text" class="textfeld"/>
<br />
<input type="image" src="images/login.jpg" alt="Absenden" class="login">
</form>
</div>
</div>
<div id="content">
<div id="content_box_header">
<p class="schrift_content_header">TIM3m ist eine skalierbare eMail-Marketing-Software für den professionellen Einsatz.</p>
</div>
<div id="content_box_content">
<p>Bei uns sind Sie richtig, egal ob Sie 3.000 oder 3.000.000 Maillings im Monat versenden möchten.
<br /><br />
<ul>
<li class="circle">TIM3m verfügt über umfassende Features</li>
<li class="circle">basiert auf modernste Technologien</li>
<li class="circle">ist seit Jahren erfolgreich im Einsatz</li>
<li class="circle">gestützt durch tiefgreifende Erfahrung im Online-Marketing</li>
<li class="circle">und ist obendrein noch preisgünstig!</li>
</ul>
<br />
Die eMail -Marketing- und Newsletter-SoftwareTIM3m kann entweder gekauft oder gemietet (ASP) werden.
</p>
</div>
<div id="content_box_footer">
<p class="schrift_content_footer">mehr...</p>
</div>
<br />
<div id="content_box_content_no_border">
<p><b>Update: Endlich Version 2.0 verfügbar!</b>
<br /><br />
<b>Was ist neu in TIM3m?</b> <br /><br />
Machen Sie sich jetzt vertraut mit den neuen <b>Features</b> unserer erfolgreichen Marketing-Lösung...
<br /><br />
Hier die neuen Features im Überblick:
<br /><br />
<ul>
<li class="circle"><b>Neu</b>: Administratorbenachrichtigungen</li>
<li class="circle"><b>Neu</b>: Spam-Filter-Check</li>
<li class="circle"><b>Neu:</b> Blacklist-Report</li>
<li class="circle"><b>Neu:</b> Online-Newsletter</li>
<li class="circle"><b>Neu:</b> Dublettenabgleich</li>
<li class="circle"><b>Neu:</b> Diagramme</li>
<li class="circle"><b>Neu:</b> Geographische Informationen</li>
<li class="circle"><b>Neu:</b> Multi-Part-eMails</li>
<li class="circle"><b>Update:</b> Löschen und Einfügen von Inhaltsblöcken</li>
</ul>
<br />
Alle Informationen jetzt > hier nachlesen!
<br /><br /><br />
<b>Neuigkeiten</b>
<br /><br />
<b>Mittelständische Unternehmen verschenken E-Mail-Marketing-Potenzial</b><br />
Fast jedes dritte deutsche Mittelstands-Unternehmen nutzt Outlook als Werkzeug für E-Mail-Marketing-Aktionen – und
lässt damit erfolgsentscheidende Möglichkeiten wie Follow-up, Controlling und Auswertung ungenutzt.<br />
Das ist ein Ergebnise unserer aktuellen Studie, die im Februar 2006 veröffentlicht wurde. Im Rahmen der Untersuchung
haben 162 (Online-)Marketingleiter deutscher Konzerne und Mittelstandsunternehmen Auskunft über ihre Erfahrungen mit
Online-Marketing gegeben.
<br /><br />
Lesen Sie mehr zum Thema Studie E-Mail-Marketing.
<br /><br />
<b>Im Durchschnitt nutzt heute jeder Deutsche das Internet täglich 58 Minuten</b>,
liest aber nur 26 Minuten Zeitungen und 18 Minuten Zeitschriften. <br />
<i>(Quelle: TimeBudget 10 SevenOne Media)</i>
<br /><br />
Die <b>Verteilung des Werbebudgets</b>, also auch die <b>Umverteilung auf eMail- und Newsletter-Marketing</b>, wird
diesem Nutzungsverhalten nicht gerecht, sondern orientiert sich noch immer an Werten der Vergangenheit:
<br /><br />
<ul>
<li class="circle">Werbebudget Internet: <b>750 Mio. €</b></li>
<li class="circle">Werbebudget Zeitungen: <b>4.972 Millionen €</b></li>
<li class="circle">Werbebudget Fach- und Publikumszeitschriften: <b>4.224 Millionen €</b></li>
</ul>
<br />
<i>(Quelle: Online-Vermarkterkreis im Bundesverband Digitale Wirtschaft e.V.)</i>
</p>
</div>
</div>
</div>
</div>
</body>
|
und das CSS:
(Styles #nav_links und #nav_rechts stellen die Rahmen dar)
| Code: |
body,html
{
margin: 0;
padding: 0;
background: #ffffff;
font: normal 90% Verdana, Arial, Helvetica, sans-serif;
}
p,h1,h2,h3,ul,li,dl,dt,dd
{
margin: 0;
padding: 0;
border: 0;
}
a
{
border: none;
text-decoration: none;
color: #706c67;
}
a:hover
{
border: none;
text-decoration: none;
color: #ec5210;
}
h1
{
position: absolute;
top: 72px;
left: 75px;
font-size: 13px;
text-align: right;
}
h2
{
margin: 28px 0 16px 0;
font-size: 11px;
}
.schrift_content_header
{
color: #FFFFFF;
}
#content_box_content p
{
padding: 4px;
}
.schrift_content_footer
{
color: #FF9900;
}
#container_main
{
width: 909px;
min-height: 600px;
margin: 0 auto;
padding: 0;
}
* html #container_main{height: 600px;}
#header
{
width: 909px;
height: 157px;
margin: 0 auto;
padding: 0;
background: #fff url(images/header.jpg) no-repeat;
}
#content_main
{
width: 909px;
color: #222;
}
#nav_links{
position: relative;
width: 142px;
min-height: 600px;
background: #fff url(images/nav_links.gif) repeat-y;
float: left;
}
* html #nav_links{
height: 600px;
}
#nav_rechts
{
width: 151px;
min-height: 600px;
background: #fff url(images/nav_rechts.gif) repeat-y;
float: right;
}
* html #nav_rechts{height:600px;}
.clear{
clear:both;
}
#content{
padding: 20px 0 0 162px;
}
#content_box_header
{
width: 566px;
max-height: 14px;
margin: 0 0 0 -4px;
padding: 2px 2px 2px 2px;
border: 2px solid #FF9900;
background: #FF9900;
}
#content_box_content
{
width: 562px;
margin: 0 0 0 -4px;
padding: 4px 4px 4px 4px;
border-left: 2px solid #FF9900;
border-right: 2px solid #FF9900;
}
#content_box_content_no_border
{
width: 566px;
margin: 0 0 0 -4px;
padding: 4px 4px 4px 4px;
}
#content_box_footer
{
width: 566px;
max-height: 20px;
margin: 0px 0 0 -4px;
padding: 2px 2px 2px 2px;
border: 2px solid #FF9900;
text-align: right;
}
#content_nav_leiste
{
width: 114px;
max-height: 10px;
margin: 0 0 0 4px;
padding: 5px 2px 10px 20px;
border-bottom: 2px solid #C7C7C7;
}
#form
{
border: 2px solid #C7C7C7;
}
input.textfeld
{
width: 120px;
border: 2px solid #C7C7C7;
background-color: #FFFFFF;
margin: -8px 0 0 10px;
padding: 0 0 0 0;
}
input.login
{
background-color: #FFFFFF;
margin: 12px 0 0 10px;
padding: 0 0 0 0;
}
label
{
width: 5em;
margin: 5px;
padding: 5px;
float: left;
}
#login
{
width: 150px;
margin: 0 0 0 0;
padding: 0 0 0 0;
//border: 2px solid #000000;
}
li.circle
{
margin: 0 0 0 40px;
list-style: circle;
}
|
P.S. Die Seite ist moment erst auf dem FF ausgelegt und noch nicht 100% optimiert.
Besten dank für die Hilfe
Ragna
Zuletzt bearbeitet von am Mi 25.10.2006 10:32, insgesamt 1-mal bearbeitet
|
|
Willkommen auf dem Portal für Mediengestalter
