XHTML Formatierung

Gesperrt
inf_azubi
Beiträge: 12
Registriert: Mi 11. Jul 2007, 18:09
Kontaktdaten:
Kontaktdaten von inf_azubi

XHTML Formatierung

Beitrag 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
Nach oben
Oldperl
Beiträge: 4316
Registriert: Do 30. Jun 2005, 22:56
Wohnort: Eltmann, Unterfranken, Bayern
Hat sich bedankt: 6 Mal
Danksagung erhalten: 4 Mal
Kontaktdaten:
Kontaktdaten von Oldperl

Re: XHTML Formatierung

Beitrag 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
ConLite 3.0.0-dev, alternatives und stabiles Update von Contenido 4.8.x unter PHP 8.x - Download und Repo auf Gitport.de
phpBO Search Advanced - das Suchwort-Plugin für CONTENIDO 4.9
Mein Entwickler-Blog
Nach oben
inf_azubi
Beiträge: 12
Registriert: Mi 11. Jul 2007, 18:09
Kontaktdaten:
Kontaktdaten von inf_azubi

Re: XHTML Formatierung

Beitrag 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
Nach oben
Gesperrt

Zurück zu „Version 4.6“