• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

100 % tabellnhöhe und bildhöhe

Status
Für weitere Antworten geschlossen.

zlab

Neues Mitglied
hi folks,

bin neu hier und bin auch ein anfänger in html und css. hab mir mal was gebastelt und krieg die 100% höhe nicht hin. was ist da falsch? es hat bestimmt viele böcke drin und wie gesagt: anfänger

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
A:link {text-decoration: none color: #006699;
	color: #006699;
	text-decoration: none;
}
A:visited {text-decoration: none color: #006699;
	text-decoration: none;
}
A:active {text-decoration: none color: #006699;
	text-decoration: none;
}
A:hover {text-decoration: none; color: #dddddd;;}

.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:none;
color:#006699;
width:140px;
padding:2px;
text-align:right;
font-weight:bold;
/*/*/border:none;/*1px solid #000000 */
}

.submenu{
margin-bottom: 0.5em;
cursor:pointer;
margin-bottom: 5px;
background-color:none;
color:#006699;
width:140px;
padding:2px;
text-align:right;

/*/*/border:none;/*1px solid #000000 */
}
 html, body {
width:800px;
height:100%;
margin:0;
padding:0;
}

</style>

<script type="text/javascript">



var persistmenu="yes" 
var persisttype="sitewide" 

if (document.getElementById){ 
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}

function SwitchMenu(obj){
	if(document.getElementById){
	var el = document.getElementById(obj);
	var ar = document.getElementById("masterdiv").getElementsByTagName("span"); 
		if(el.style.display != "block"){ 
			for (var i=0; i<ar.length; i++){
				if (ar[i].className=="submenu") 
				ar[i].style.display = "none";
			}
			el.style.display = "block";
		}else{
			el.style.display = "none";
		}
	}
}

function get_cookie(Name) { 
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { 
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function onloadfunction(){
if (persistmenu=="yes"){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}

function savemenustate(){
var inc=1, blockid=""
while (document.getElementById("sub"+inc)){
if (document.getElementById("sub"+inc).style.display=="block"){
blockid="sub"+inc
break
}
inc++
}
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=(persisttype=="sitewide")? blockid+";path=/" : blockid
document.cookie=cookiename+"="+cookievalue
}

if (window.addEventListener)
window.addEventListener("load", onloadfunction, false)
else if (window.attachEvent)
window.attachEvent("onload", onloadfunction)
else if (document.getElementById)
window.onload=onloadfunction

if (persistmenu=="yes" && document.getElementById)
window.onunload=savemenustate

</script>
</head>

<body>
<table "height:100%;" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <th height="73" scope="col"></th>
    <th height="73" colspan="2" scope="col"></th>
  </tr>
  <tr>
    <td width="206" rowspan="2" valign="top">
<div id="masterdiv">

	<div class="menutitle" onclick="SwitchMenu('sub1')">[url="notice.htm"]Profil[/url]</div>
	

	<div class="menutitle" onclick="SwitchMenu('sub2')">Projekte</div>
	<span class="submenu" id="sub2">
		[url="notice.htm"]Robotik[/url]

		[url="faqs.htm"]Biomechanik[/url]

		[url="help.htm"]Industrie[/url]

		[url="help.htm"]Unterhaltung[/url]

		[url="help.htm"]Patente[/url]</span>

	<div class="menutitle" onclick="SwitchMenu('sub3')">[url="notice.htm"]Partnerschaft[/url]</div>
	

	
	<div class="menutitle" onclick="SwitchMenu('sub4')">[url="notice.htm"]Potenzial[/url]</div>
	
	
	
	<div class="menutitle" onclick="SwitchMenu('sub5')">[url="notice.htm"]Post[/url]</div>

	

<div class="menutitle" onclick="SwitchMenu('sub6')">[url="notice.htm"]Anfahrt[/url]</div> </td>
    <td width="37" height="100%" rowspan="2" valign="top">[img]layout/strich.jpg[/img]</td>
    
  </tr>
  <tr>
    <td height="40"></td>
  </tr>
</table>
</body>
</html>
 
Hallo, hab immer noch das problem das ich die tabelle nicht auf 100% höhe bringe. ich möchte eine grafik (ein strich) der immer nach unten vollständig durch geht, also immer 100% höhe hat. muss ich die höhe bei der grafik oder bei der tabelle eingeben? hab schon probiert und es funzt leider nicht. was ist falsch???

hoffe Ihr könnt mir helfen, vielen Dank!

///Edit: zum besseren verständnis was ich meine hier ne grafik:

http://www.zlab.ch/test.jpg


hier mal der code:

Code:
<body>
<table width="800" align="center" border="1">
  <tr>
    <td colspan="2">[img]logo/logo.jpg[/img]</td>
    <td></td>
  </tr>
  <tr>
    <td><div id="masterdiv">

	<div class="menutitle" onclick="SwitchMenu('sub1')">Über uns</div>
	<span class="submenu" id="sub1">
		- [url="profil.htm"]Profil[/url]

		- [url="potential.htm"]Potential[/url]
	</span>

	<div class="menutitle" onclick="SwitchMenu('sub2')">Projekte</div>
	<span class="submenu" id="sub2">
		- [url="robotik.htm"]Robotik[/url]

		- [url="biomechanik.htm"]Biomechanik[/url]

		- [url="industrie.htm"]Industrie[/url]

		- [url="unterhaltung.htm"]Unterhaltung[/url]
	</span>

	<div class="menutitle" onclick="SwitchMenu('sub3')">Partnerschaft</div>
	<span class="submenu" id="sub3">
		- [url="partner_sein.htm"]Partner sein[/url]

		- [url="partner_werden.htm"]Partner werden[/url]
	</span>
	
	<div class="menutitle" onclick="SwitchMenu('sub4')">Kontakt</div>
  <span class="submenu" id="sub4">
		- [url="post.htm"]Post[/url]

		- [url="anfahrt.htm"]Anfahrt[/url]
  </span>

<div class="menutitle" onclick="SwitchMenu('sub5')">Hintergrund</div>
  <span class="submenu" id="sub5">
		- [url="links.htm"]Links[/url]

		- [url="impressum.htm"]Impressum[/url]

		- [url="sitemap.htm"]Sitemap[/url]
  </span>


</div> </td>
    <td>[img]layout/strich.jpg[/img]</td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>
</body>
 
Hi zlab

ich verstehe nicht wirklich warum du für eine "einfache Trennlinie so ein "aufwendiges" Design nimmst.
Hier mal deine Seite ganz simpel:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
          "http://www.w3.org/TR/html4/loose.dtd"> 
 <html> 
    <head> 
	<title></title> 
	<style type= "text/css"> 
    </style>
	</head> 
<body> 
<table width="800" align="center" border="1" cellpadding="0" cellspacing="0"> 
	<tr> 
		<td colspan="2">[img]logo/logo.jpg[/img]</td> 
	</tr> 
	<tr> 
    	<td width="150"><div id="masterdiv"> 

		<div class="menutitle" onclick="SwitchMenu('sub1')">&Uuml;ber uns</div> 
		<span class="submenu" id="sub1"> 
		- [url="profil.htm"]Profil[/url]
 
		- [url="potential.htm"]Potential[/url] 
		</span> 

		<div class="menutitle" onclick="SwitchMenu('sub2')">Projekte</div> 
		<span class="submenu" id="sub2"> 
		- [url="robotik.htm"]Robotik[/url]
 
		- [url="biomechanik.htm"]Biomechanik[/url]
 
		- [url="industrie.htm"]Industrie[/url]
 
		- [url="unterhaltung.htm"]Unterhaltung[/url] 
		</span> 

		<div class="menutitle" onclick="SwitchMenu('sub3')">Partnerschaft</div> 
		<span class="submenu" id="sub3"> 
		- [url="partner_sein.htm"]Partner sein[/url]
 
		- [url="partner_werden.htm"]Partner werden[/url] 
		</span> 
    
		<div class="menutitle" onclick="SwitchMenu('sub4')">Kontakt</div> 
		<span class="submenu" id="sub4"> 
		- [url="post.htm"]Post[/url]
 
		- [url="anfahrt.htm"]Anfahrt[/url] 
		</span> 

		<div class="menutitle" onclick="SwitchMenu('sub5')">Hintergrund</div> 
		<span class="submenu" id="sub5"> 
		- [url="links.htm"]Links[/url]
 
		- [url="impressum.htm"]Impressum[/url]
 
		- [url="sitemap.htm"]Sitemap[/url] 
		</span> 
		</div> 
		</td> 
		
		<td></td> 
	</tr> 
</table> 
</body>  
</html>

Wenn du jetzt noch eine zusätzliche Trennlinie benötigst kannst du mit einer Hintergrundgrafik arbeiten. Sinnvoller wäre es jedoch einfach nur die Rahmen entsprechend zu formatieren. ;)

Gruß
Hobbyuser
 
hallo hobbyuser

danke für deine Antwort. hab noch das problem, dass die tabellenhöhe die 100% nicht nimmt, keine Ahnung wieso. Die Breite nimmt er. ist das ein bekanntes problem? liegt das vieleicht an der navigation?
 
hammer!

vielen Dank! ist grad mit dem IE noch problematisch, hab der obersten <td> eine feste grösse gegeben und mit FF funzt es. Beim IE zerreist es mir das ganze nach unten, komisch. werd noch ein wenig pröbeln.

Danke für den Link
 
der browser muss auch wissen, was 100% sein sollen. wenn der body ne feste höhe hat kannst du das machen aber wenn du den body keine größe zugewiesen hast, weiß der browser ja nicht was 100% sein sollen.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben