✔ Layout problem

Status
Nicht offen für weitere Antworten.
kevkev

kevkev

Erfahrenes Mitglied
Hallo,

Mein Problem:
In dem angehängtem Bild seht Ihr 7 Bilder, die Ich alle aufteilen muss.
Diese Bilder per css richtig hinzurichten wäre kein problem, aber das ganze _muss- noch zentriert sein, je nach Auflösung.
Die einzigste möglichkeit wäre mit float das hinzuwurschteln, aber ich habs nicht geschafft.

Angaben wie top oder left darf ich nicht verwenden, da sonst das nicht mehr zentriert wird.
Mit tabellen hab ich es auch schon probiert, aber da macht der IE wieder probleme.

Kann mir da jemand helfen?

gruß kevin
 

Anhänge

  • bild.jpg
    bild.jpg
    8,6 KB · Aufrufe: 76
Hallo!

Wo macht denn der IE mit Tabellen Probleme? :suspekt:
Bei mir jedenfalls nicht.

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Tabelle</title>
<style type="text/css">
 html, body { width:100%; height:100%; margin:0px; padding:0px; }
 table.aussen { border:0px; width:100%; height:100%; }
 table.innen { border:1px solid silver; width:600px; height:200px; }
 .bilder td { border:1px solid silver; text-align:center; }
 img { width:50px; }
</style>
</head>
<body>
<table class="aussen" cellpadding="0" cellspacing="0">
 <tr>
  <td align="center">
   <table class="innen" cellpadding="0" cellspacing="0">
	<tr class="bilder">
	 <td colspan="5"><img src="bild1.gif" alt=""></td>
	 <td rowspan="2"><img src="bild7.gif" alt=""></td>
	</tr>
	<tr class="bilder">
	 <td><img src="bild2.gif" alt=""></td>
	 <td><img src="bild3.gif" alt=""></td>
	 <td><img src="bild4.gif" alt=""></td>
	 <td><img src="bild5.gif" alt=""></td>
	 <td><img src="bild6.gif" alt=""></td>
	</tr>
   </table>
  </td>
 </tr>
</table>
</body>
</html>
Gruss Dr Dau
 
Hi,

Ich hab mal meine aktuelle Seite hochgeladen:
http://www.kevin-k.com/6/home/

Im FF funktionierts, aber im IE sind merkwürdige abstände drinnen, und ich weiß nicht woher die kommen. schau mal im quelltext, woher kommen diese abstände?

gruß kevin
 
Hi,

Nein, leider nicht. Es wäre soo cool wenn ich solche Icons erstellen könnte, ich finde diese 3d icons von Linux (das iconset is nuvola) total schön.
Ich hoffe die icons rechtlich gesehen frei. muss ich mal nachprüfen.

gruß kevin

//edit 1

Ich weiß nicht warum, aber die tabellen spinnen im IE total.

Hier ein Teil meines Quelltextes das ich für die Page verwende:
PHP: 
<?php
	
	function img_size ($img){
		$size = getimagesize($img);
		return $size[3];
	}

	function img ($array) {
		return "<img border=\"0\" src=\"".$array[0]."\" ".$array[1]." alt=\"".$array[2]."\">";
	}
	
	$root = "../"; //pngbehavior.php ändern

	$array['icons']['home'] = array($root."img/icons/home.png", img_size($root."img/icons/home.png"), "Home");
	$array['icons']['upload'] = array($root."img/icons/upload.png", img_size($root."img/icons/upload.png"), "Upload");
	$array['icons']['remote_upload'] = array($root."img/icons/remote_upload.png", img_size($root."/img/icons/remote_upload.png"), "Remote Upload");
	$array['icons']['news'] = array($root."img/icons/news.png", img_size($root."img/icons/news.png"), "News");
	$array['icons']['statistik'] = array($root."img/icons/statistik.png", img_size($root."img/icons/statistik.png"), "Statistik");
	$array['icons']['trenn_icon_10px'] = array($root."img/icons/trenn_icon_10px.png", img_size($root."img/icons/trenn_icon_10px.png"), "");
	$array['icons']['trenn_icon_6px'] = array($root."img/icons/trenn_icon_6px.png", img_size($root."img/icons/trenn_icon_6px.png"), "");
	$array['icons']['help'] = array($root."img/icons/help.png", img_size($root."img/icons/help.png"), "ALT-TEXT");
	
	$array['img']['top'] = array($root."img/top.png", img_size($root."img/top.png"), "Top");
	$array['img']['top2'] = array($root."img/".$theme."/top2.png", img_size($root."img/".$theme."/top2.png"), "Top2");
	$array['img']['main_bg'] = array($root."img/bg_main.jpg", img_size($root."img/bg_main.jpg"), "Main BG");
	$array['img']['blank1'] = array($root."img/".$theme."/blank1.png", img_size($root."img/".$theme."/blank1.png"), "Blank1");
	$array['img']['blank2'] = array($root."img/".$theme."/blank2.png", img_size($root."/img/".$theme."/blank2.png"), "Blank2");
	$array['img']['bg'] = array($root."img/back-body.jpg", img_size($root."img/back-body.jpg"), "BG");
	$array['img']['main'] = array($root."img/".$theme."/main.png", img_size($root."img/".$theme."/main.png"), "Main");
	
	//$array['icons'][''] = array(, img_size(), "");
	
	define(home, $root."home");
	define(upload, $root."upload");
	define(remote_upload, $root."remote_upload");
	define(news, $root."news");
	define(statistik, $root."statistik");
	

	
	

?>
<html>

<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=windows-1252\">

<style type="text/css">
	
	body { 
		background-image:url(<?php echo $array['img']['bg'][0]; ?>);
	}
	
	table.body {
		font-family:verdana;
		font-size:10px;
	}

	.main2 {
		background-image:url(<?php echo $array['img']['main_bg'][0]; ?>);
		padding-left:15px;
	}
	
	#impressum {
		font-size:9px;
	}
	
	a:link {
	  color:black;
	  text-decoration: none;
	}
	
	a:visited {
	  color:black;
	  text-decoration: none;
	}
	
	a:hover {
	  color:gray;
	  text-decoration: none;
	}
	
	a:active {
	  color:gray;
	  text-decoration: none;
	}
	
	img {
		behavior:	url("<?php echo $root; ?>pngbehavior.htc");
	}
</style>

</head>
<body>


<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse">
  <tr>
    <td>
    	<?php echo img($array['img']['top']); ?>
	</td>
    <td rowspan="2">
    	<?php echo img($array['img']['top2']); ?>
	</td>
  </tr>
  <tr>
    <td>
    <?php echo img($array['icons']['trenn_icon_10px']); ?><a href="<?php echo home; ?>"><?php echo img($array['icons']['home']); ?></a><?php echo img($array['icons']['trenn_icon_10px']); ?><a href="<?php echo upload; ?>"><?php echo img($array['icons']['upload']); ?></a><?php echo img($array['icons']['trenn_icon_10px']); ?><a href="<?php echo remote_upload; ?>"><?php echo img($array['icons']['remote_upload']); ?></a><?php echo img($array['icons']['trenn_icon_10px']); ?><a href="<?php echo news; ?>"><?php echo img($array['icons']['news']); ?></a><?php echo img($array['icons']['trenn_icon_10px']); ?><a href="<?php echo statistik; ?>"><?php echo img($array['icons']['statistik']); ?></a><?php echo img($array['icons']['trenn_icon_6px']); ?>
	</td>
  </tr>
  <tr>
    <td colspan="2">
    	<?php echo img($array['img']['blank1']); ?>
	</td>
  </tr>
  <tr>
    <td colspan="2">
    	<?php echo img($array['img']['main']); ?>
	</td>
  </tr>
  <tr>
    <td colspan="2">
    	<?php echo img($array['img']['blank2']); ?>
	</td>
  </tr>
  <tr>
    <td colspan="2">
		SEITEN INHALT
	</td>
  </tr>
</table>

</body>
</html>

Findet Ihr einen Fehler? :(

gruß kevin


//edit 2

AHhh, ich schmeiß mich weg :)!
Ich hab die </td> tags der übersichtlichkeithalber umgebrochen, und da macht der IE e draus :)!


Juuhuu ^^.

Danke an alle :)!

Gruß Kevin
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück