Seite 1 von 1

XHTML Formatierung

Verfasst: Fr 24. Jul 2009, 17:11
von inf_azubi
Hallo!

Habe ein riesen Problem und komme einfach nicht weiter, hab auch schon 1000mal gegoogelt
und im selfhtml nachgelesen.
Ich hab ein Modul geschrieben, welches kontaktinfos ausgibt wenn man die maus über ein definierten bildbereich bewegt.
alles gut, funzt auch.
Aber damit es nicht nur im FireFox funktioniert, sondern auch im IE, musste ich die HTML-Dokumententyp-Deklaration
um XHTML erweitern.
Nun funktioniert das Modul auch im IE und FF, jedoch sieht meine Seite jetzt im IE total verschoben aus.
Ich geh mal davon aus, dass es daran liegt, dass ich das Layout nicht XHTML konform geschrieben habe.
Wäre echt supi wenn mal jemand nen Blick drauf werfen könnte und mir weiterhelfen könnte.

Das ist der Code des Layouts:

Code: Alles auswählen

<!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" lang="de">

<head>
<title>IHB INGENIEUR-HOCH-BAU POTSDAM GMBH</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<meta name="Page-topic" content="" />
<meta name="Page-type" content="" />
<meta http-equiv="expires" content="0" />
<meta name="page-type" CONTENT="information" /> 
<meta name="audience" CONTENT="all" /> 
<meta name="author" CONTENT="" /> 
<meta name="publisher" CONTENT=""> 
<meta name="copyright" CONTENT="" /> 
<meta name="revisit-after" CONTENT="30 days" /> 
<meta name="ROBOTS" CONTENT="INDEX, FOLLOW" /> 
<meta name="Content-Language" CONTENT="de" />

<link rel="STYLESHEET" type="text/css" href="css/styleIHB.css" />
<link rel="STYLESHEET" type="text/css" href="css/lightbox.css" />

<link rel="STYLESHEET" type="text/css" href="css/personal.css" />

<script language="JavaScript" src="scripts/scripts.js"></script> 

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>


</head>
<body bgcolor="#FFffFF">
<map name="Map">
<area shape="rect" coords="21,16,183,170" href="front_content.php" alt="Zur Startseite">
<area shape="rect" coords="649,172,762,189" href="front_content.php" alt="Zur Startseite">
<area shape="rect" coords="771,172,843,189" href="front_content.php?idart=102" alt="Zum Kontaktformular">
<area shape="rect" coords="849,172,917,188" href="front_content.php?idcat=91" alt="Zum Impressum">
</map>

<center>
<table cellspacing="0" cellpadding="0" border="1" align="center" width="947">
<tr> 
<td valign="top"><img src="upload/globalimages/header2.jpg" alt="" border="0" usemap="#map"></td>
</tr>
<tr> 
<td valign="top" background="upload/globalimages/bgcontent2.jpg">

<!-- ******************************************* -->
<!-- *              Hauptinhalt                * -->
<!-- ******************************************* -->

<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr> 
<td valign="top" width="100%">
<table cellspacing="0" cellpadding="0" border="0" width="100%"> 
<tr>
<td valign="top" width="186">
<table cellspacing="0" cellpadding="0" border="0" width="95%"> 
<tr>
<td width="14">&nbsp;</td>
<td width="167" valign="top" class="hauptnavi">CMS_CONTAINER[2]</td>
</tr> 
</table></td>
<td width="761" valign="top">
<table cellspacing="2" cellpadding="6" border="0" width="730"> 
<tr>
<td colspan=2 class="headline">CMS_CONTAINER[6]</td>
</tr><tr>
<td width="480"  height="365" align="left" valign="top" class="contenttxt">CMS_CONTAINER[3]</td>
<td valign="top" class="contenttxt" >CMS_CONTAINER[4]</td>
</tr>
<tr>
<td colspan="2" class="contenttxt">CMS_CONTAINER[5]</td>
</tr> 
</table></td>
</tr>
</table></td>
</tr>
</table></td>

<!-- ******************************************* -->
<!-- *                 Footer                  * -->
<!-- ******************************************* -->

</tr>
<tr> 
<td valign="top">
<img src="upload/globalimages/footer2.jpg" alt="" border="0"></td>
</tr>
</table>

</center>
</body>
</html>
Danke an alle

Re: XHTML Formatierung

Verfasst: Sa 25. Jul 2009, 11:38
von Oldperl
:arrow: verschoben nach Misc da kein Modul-Request. 8)

btw, bist du sicher das es sich um eine 4.6.x Version von Contenido handelt?
Bitte poste auch noch die CSS, ohne ist es schwer was zu deinem Layout zu sagen.

Gruß aus Franken

Ortwin

Re: XHTML Formatierung

Verfasst: Sa 25. Jul 2009, 11:54
von inf_azubi
so hier meine hauptcss:

Code: Alles auswählen

/* General */
* {
	margin: 0;
	padding: 0;
} 


/* ################################################################# */

/* Main navigation */
div#mnavi a {
        display: block;
	/* margin: 0 0 0 12px; */
	padding: 3px 0 0 0;
        /* color: #334f77; */
        color: #F5C300;
        text-decoration: none;
	font-family : Verdana;
	font-weight: bold;
        font-size: 12px;
}

div#mnavi a:hover{
        display: block;
	/* margin: 0 0 0 12px; */
	padding: 3px 0 0 0;
        color: #FFffFF;
	font-family : Verdana;
	font-weight: bold;
}

/* ############## Hauptnavigation ###################*/

div#mnavi a.e1a { /* #### Ebene 1, ausgewählt, keine Unterpunkte ####*/
        margin: 0 0 0 12px;
        width: 130;
        color: #FFffFF;}

div#mnavi a.e1oa { /* #### Ebene 1,ausgewählt,hat weitere Unterpukte ####*/
        margin: 0 0 0 12px;
        width: 130;
        color: #FFffFF;}

div#mnavi a.e1o { /* background-color:#FFff00; */
        margin: 0 0 0 12px;
        width: 130; 
        font-family : Verdana;
	font-weight: bold;
        color: #FFffFF;}

div#mnavi a.e1p { /* #### Elemente Ebene 1 nicht ausgewählt ####*/
        margin: 0 0 0 12px;
        width: 130;
        font-family : Verdana;
	font-weight: bold;}

div#mnavi a.e2a { /* #### Ebene 2 offen und anderes Element ausgewählt ####*/
        margin: 0 0 0 30px;
        width: 115;
        color: #FFffFF;}

div#mnavi a.e2oa { /* #### Ebene 2 offen und anderes Element ausgewählt ####*/
        margin: 0 0 0 30px;
        width: 115;}

div#mnavi a.e2o { /* #### Ebene 2 ausgewählt ####*/
        margin: 0 0 0 30px;
        width: 115;}

div#mnavi a.e2p { /* #### Elemente Ebene 2 nicht ausgewählt ####*/
        margin: 0 0 0 30px;
        width: 115;}

/* ################################################################################ */

.headline 	{
		text-decoration: none;
		color:#CF3101;
		font-size : 14px;
		font-family : Verdana;
		font-weight: bold;
		}
		
.contenttxt 	{
		text-decoration: none;
		color:#000000;
		font-size : 12px;
		font-family : Verdana;
		}

.contenttxtsearch 	{
		text-decoration: none;
		color:#000000;
		font-size : 10px;
		font-family : Verdana;
		}
		
.contenttxtwhite 	{
		text-decoration: none;
		color:#ffffff;
		font-size : 10px;
		font-family : Verdana;
		}
		
.contentbig 	{
		text-decoration: none;
		color:#556370;
		font-size : 10px;
		font-family : Verdana;
		}

.contentft 	{
		text-decoration: none;
		color:#556370;
		font-size : 10px;
		font-family : Verdana;
		}

.contentftrot 	{
		text-decoration: none;
		color:#556370;
		font-size : 10px;
		font-family : Verdana;
		}

A.small:link		{
		text-decoration: none;
		color:#FF0000;
		font-size : 10px;
		font-family : Verdana;
		}
		
A.small:visited	{
		text-decoration: none;
		color:#FF0000;
		font-size : 10px;
		font-family : Verdana;
		}
		
A.small:active	{
		text-decoration: none;
		color:#FF0000;
		font-family : Verdana;
		font-size : 10px;
		}
		
A.small:hover 	{
		text-decoration: none;
		color:#000099;
		font-size : 10px;
		font-family : Verdana;
		}
		
A:link		{
		text-decoration: none;
		color:#CF3101;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A:visited	{
		text-decoration: none;
		color:#CF3101;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A:active	{
		text-decoration: none;
		color:#CF3101;
		font-family : Verdana;
		font-weight: bold;
		font-size : 10px;
		}
		
A:hover 	{
		text-decoration: underline;
		color:#939292;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;                                
		}

A.special:link		{
		text-decoration: none;
		color:#F5C300;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.special:visited	{
		text-decoration: none;
		color:#F5C300;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.special:active	{
		text-decoration: none;
		color:#F5C300;
		font-family : Verdana;
		font-weight: bold;
		font-size : 10px;
		}
		
A.special:hover 	{
		text-decoration: none;
		color:#ebebeb;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}

A.navi:link		{
		text-decoration: none;
		color:#EF461D;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.navi:visited	{
		text-decoration: none;
		color:#EF461D;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.navi:active	{
		text-decoration: none;
		color:#EF461D;
		font-family : Verdana;
		font-weight: bold;
		font-size : 10px;
		}
		
A.navi:hover 	{
		text-decoration: underline;
		color:#939292;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;                                
		}

A.navion:link		{
		text-decoration: none;
		color:#ffffff;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.navion:visited	{
		text-decoration: none;
		color:#ffffff;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.navion:active	{
		text-decoration: none;
		color:#ffffff;
		font-family : Verdana;
		font-weight: bold;
		font-size : 10px;
		}
		
A.navion:hover 	{
		text-decoration: underline;
		color:#ebebeb;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;                                
		}

A.navi2:link		{
		text-decoration: none;
		color:#254BAC;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.navi2:visited	{
		text-decoration: none;
		color:#254BAC;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;
		}
		
A.navi2:active	{
		text-decoration: none;
		color:#254BAC;
		font-family : Verdana;
		font-weight: bold;
		font-size : 10px;
		}
		
A.navi2:hover 	{
		text-decoration: underline;
		color:#939292;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;                                
		}

/* ########### Aktuelle Projekte-Content-List ################ */

A.NewsHeadline:link {
		text-decoration: none;
		/* color:#CF3101; */
		/* color: #254BAC; */
                color: #336699;
                font-size : 14px;   
		font-family : Verdana;
		font-weight: bold;
      		}

A.NewsHeadline:hover 	{
		text-decoration: none;
		color:#FFffFF;
		font-size : 14px;
		font-family : Verdana; 
		font-weight: bold;                                
		}

A.NewsMore:link {
		text-decoration: none;
		color:#336699;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;                               
		}

A.NewsMore:hover 	{
		text-decoration: none;
		color:#FFffFF;
		font-size : 10px;
		font-family : Verdana;
		font-weight: bold;                                
		}

P.NewsText 	{
		text-decoration: none;
		color:#000000;
		font-size : 12px;
		font-family : Verdana;                               
		}

/* Content */
h1 {
	font-size: 16px;
	color: #D9681C;
}

a.artikelliste { text-decoration: none;
		 color:#F5C300;
		 font-size : 10px;
		 font-family : Verdana;
		 font-weight: bold;                                
		}

a.artikelliste:hover { text-decoration: none;
		 color:#FFffFF;
		 font-size : 10px;
		 font-family : Verdana;
		 font-weight: bold;                                
		}

/* ########### BOX ################ */

img {
border:none;
}

#box{
height:80px;
width:80px;
padding:0;
margin:20px;
border:1px solid black;
font:bold 14px verdana, sans-serif;}

#box div{display:none;}

#box:hover div{
display:block;
width:300px;
position:absolute;top:20px;right:20px;
border:1px dashed black;
padding:15px;
font:normal 14px verdana, sans-serif;}


a.partner { text-decoration: none;
		 color:#000000;
		 font-size : 14px;
		 font-family : Verdana;                                
		}

a.partner:hover { text-decoration: none;
		 color:#336699;
		 font-size : 14px;
		 font-family : Verdana;
		 font-weight: bold;                                
		}
So und hier die CSS fürs bildModul

Code: Alles auswählen

#info {padding:0em 0;}

/* The group of people */

#gmap {display:block; width:490px; height:360px; background:url(../upload/personal/personal1.jpg); position:relative; top:2px;}
#gmap div {color:#000; font-family:Verdana; font-size:10px;}
/*#gmap div {color:#000; font-family:arial, sans-serif; font-size:1.2em; font-weight:bold; text-transform:uppercase;}*/
div#scheid {
	display:block;
	width:58px;
	height:59px;
	overflow:hidden;
	padding-top:105px;
	position:absolute;
	left:293px;
	top:135px;
}

div#scheid2 {
	display:block;
	width:121px;
	height:36px;
	position:absolute;
	left:-30px;
	top:166px;
	border:dashed;
	border-color:#FFFFFF;
	border-width:thin;
	background-color:#CCCCFF;
	font-family:Verdana;
	font-size:10px;
	}
	
div#ali {
	display:block;
	width:44px;
	height:41px;
	overflow:hidden;
	padding-top:105px;
	position:absolute;
	left:244px;
	top:141px;
}

div#ali2 {
	display:block;
	width:121px;
	height:36px;
	position:absolute;
	left:-41px;
	top:150px;
	border:dashed;
	border-color:#FFFFFF;
	border-width:thin;
	background-color:#CCCCFF;
	font-family:Verdana;
	font-size:10px;
	}
div#mueller {
	display:block;
	width:53px;
	height:57px;
	overflow:hidden;
	padding-top:105px;
	position:absolute;
	left:185px;
	top:132px;
}

div#mueller2 {
	display:block;
	width:121px;
	height:36px;
	position:absolute;
	left:-38px;
	top:162px;
	border:dashed;
	border-color:#FFFFFF;
	border-width:thin;
	background-color:#CCCCFF;
	font-family:Verdana;
	font-size:10px;
	}
div#duschek {
	display:block;
	width:38px;
	height:34px;
	overflow:hidden;
	position:absolute;
	left:330px;
	top:100px;
	font-family:Verdana;
	font-size:10px;
}

div#duschek2 {
	display:block;
	width:121px;
	height:36px;
	position:absolute;
	left:-39px;
	border:dashed;
	border-color:#FFFFFF;
	border-width:thin;
	background-color:#CCCCFF;
	font-family:Verdana;
	font-size:10px;
	top: 36px;
	}

div#scheid:hover {background:transparent /*url(../upload/personal/group_nancy.gif)*/ ; overflow:visible;}
div#ali:hover {background:transparent; overflow:visible;}
div#mueller:hover {background:transparent; overflow:visible;}
div#duschek:hover {background:transparent; overflow:visible;}
Und zu guter letzt hab ich eben extra nochmal im CMS geschaut, es ist die Version 4.6.24
MfG