mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 20.04.2024 03:31 Benutzername: Passwort: Auto-Login

Thema: div problem :( vom 31.07.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> div problem :(
Autor Nachricht
StreetGlow
Threadersteller

Dabei seit: 14.11.2005
Ort: Parchim
Alter: 41
Geschlecht: Männlich
Verfasst Di 31.07.2007 15:38
Titel

div problem :(

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich habe da ein kleines Css Problem mit Divs und finde einfach nicht die Lösung dafür...
Vielleicht kann mir hier jemand weiterhelfen. Es geht um folgendes:
ich habe zwei div-felder nebeneinander. in den linken soll die navigation und in den rechten der inhalt.
damit die beiden sichtbar voneinander getrennt sind (da sie die gleiche hintergrundfarbe haben) habe ich dem linken div einen roten rahmen 1px zugewiesen. außerdem habe ich ihm die breite zugewiesen und dem rechten ebenfalls.
nun ist aber das problem, dass wenn im rechten mehr inhalt steht als im linken, ist der "trennrahmen" plötzlich zu ende... kann man denen nicht eine feste höhe vorgeben damit sie gleich hoch sind?
hier das css von den divs:
Code:

#left {
PADDING-RIGHT: 5px; Border-Right:#FF0000 1px solid ;BORDER-TOP: #ff0000 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; COLOR: #000000; PADDING-TOP: 5px; BACKGROUND-COLOR: #ffffff;
width:120px; height:inherit;
float:left;
}

#content {
   PADDING-RIGHT: 5px; BORDER-TOP: #ff0000 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; COLOR: #000000; PADDING-TOP: 5px; BACKGROUND-COLOR: #ffffff; float:right
}


und hier die php div tags:
Code:

<div id=left style="width:120px;height:100px;overflow:auto;">Navigation</div>

<DIV id=content>Inhalt</div>
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
DesignLöwe

Dabei seit: 27.02.2007
Ort: -
Alter: 37
Geschlecht: Weiblich
Verfasst Di 31.07.2007 15:44
Titel

Antworten mit Zitat Zum Seitenanfang

ja du kannst mit einer festen höhe und overflow:auto; den gewünschten Effekt hervorrufen.;

Beispiel
Code:

#left {
height:50px;
width:50px;
overflow:auto;
}
  View user's profile Private Nachricht senden
Anzeige
Anzeige
StreetGlow
Threadersteller

Dabei seit: 14.11.2005
Ort: Parchim
Alter: 41
Geschlecht: Männlich
Verfasst Di 31.07.2007 15:58
Titel

Antworten mit Zitat Zum Seitenanfang

das funzt irgendwie net *Schnief*
jetzt sieht das ganze noch seltsamer aus...
ich stell zur veranschaulichung mal den quellcod der seite hier hinein:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xml:lang="de" xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Test</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<META content="Baxxter" name=Author>
<META
content="test"
name=description>
<META
content="test"
name=keywords>
<STYLE type=text/css>BODY {
   FONT-SIZE: 12px; FONT-FAMILY: Verdana; BACKGROUND-COLOR: #FFFFFF; TEXT-ALIGN: center
}
H1 {
   FONT-SIZE: 18px; MARGIN: 0px; COLOR: #000000
}
H2 {
   FONT-SIZE: 14px; COLOR: #000000
}
H3 {
   FONT-SIZE: 14px; COLOR: #000000
}
P {
   MARGIN-TOP: 0px
}
CODE {
   FONT-SIZE: 14px; COLOR: #0000cc
}
PRE {
   PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-SIZE: 14px; PADDING-BOTTOM: 5px; COLOR: #0000cc; PADDING-TOP: 5px
}
A:link {
   FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #000000; TEXT-DECORATION: underline
}
A:visited {
   FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #000000; TEXT-DECORATION: underline
}
A:active {
   FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #000000; TEXT-DECORATION: underline
}
A:hover {
   FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #000000; TEXT-DECORATION: underline
}
A:active {
   COLOR: #ff9200
}
A:hover {
   COLOR: #ff9200
}
A.menu:link {
   COLOR: #000000; TEXT-DECORATION: none
}
A.menu:visited {
   COLOR: #000000; TEXT-DECORATION: none
}
A.menu:active {
   COLOR: #FF0000
}
A.menu:hover {
   COLOR: #FF0000
}
#title {
   PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; HEIGHT: 30px; BACKGROUND-COLOR: #9c9a63; TEXT-ALIGN: center
}
#menu {
   PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; COLOR: #ff0000; PADDING-TOP: 5px; BACKGROUND-COLOR: #ffffff; TEXT-ALIGN: center
}
#left {
PADDING-RIGHT: 5px; Border-Right:#FF0000 1px solid ;BORDER-TOP: #ff0000 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; COLOR: #000000; PADDING-TOP: 5px; BACKGROUND-COLOR: #ffffff;
width:120px; height:750px;
 overflow:auto;
}
#content {
   PADDING-RIGHT: 5px; BORDER-TOP: #ff0000 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; COLOR: #000000; PADDING-TOP: 5px; BACKGROUND-COLOR: #ffffff;  width:630px; height:750px; overflow:auto
}
</STYLE>

<META content="MSHTML 6.00.6000.16481" name=GENERATOR></HEAD>
<BODY><!--  Gesamter Inhalt  -->
<DIV
style="BORDER-RIGHT: #ff0000 1px solid; BORDER-TOP: #ff0000 1px solid; MARGIN: 0px auto; BORDER-LEFT: #ff0000 1px solid; WIDTH: 760px; BORDER-BOTTOM: #ff0000 1px solid; TEXT-ALIGN: left"><!--  Titelzeile  -->
  <img src="images/head.jpg" alt="Header Logo" width="760" height="200" align="absmiddle">
<!--  Menü  -->
<DIV id=menu><A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">Home</A>&nbsp;&nbsp;|&nbsp;&nbsp;<A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">&uuml;ber uns</A>&nbsp;&nbsp;|&nbsp;&nbsp; <A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">Leistungen</A>&nbsp;&nbsp;|&nbsp;&nbsp; <A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">Referenzen</A>&nbsp;&nbsp;|&nbsp;&nbsp; <A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">Jobs</A>&nbsp;&nbsp;|&nbsp;&nbsp; <A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">Kontakt</A>&nbsp;&nbsp;|&nbsp;&nbsp; <A class=menu
href="http://www.css4you.de/wslayout1/ex0003.html#">Impressum</A> </DIV><!-- Inhalt -->

<div id=left>Unter-Navigation</div>

<DIV id=content>Inhalt</DIV>
</DIV>
</BODY>
</HTML>
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
StreetGlow
Threadersteller

Dabei seit: 14.11.2005
Ort: Parchim
Alter: 41
Geschlecht: Männlich
Verfasst Mi 01.08.2007 08:10
Titel

Antworten mit Zitat Zum Seitenanfang

kann mir denn niemand dabei weiterhelfen? *Schnief*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Mac

Dabei seit: 26.08.2005
Ort: Köln
Alter: 62
Geschlecht: Männlich
Verfasst Mi 01.08.2007 08:29
Titel

Antworten mit Zitat Zum Seitenanfang

Das Problem von 'wachsenden Spalten' findest du exemplarisch gelöst zb. bei
www.yaml.de
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen Formmailer-Problem-neues problem
css-problem
css-Problem
xtc-Problem
Problem mit IE
Problem in IE
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.