mambotemplate ohne tables

timail · #1 (**permalink**) 31.05.2005, 23:10

hallo,
ich bin gerade dabei ein mambotemplate (mambo os cms v4.5.2) ohne tables, also d.h. komplett css basierend (soweit möglich) zu erstellen - siehe:
http://intranetdasmedienkombinatde.h...ates/index.php

problem ist, das ich es trotz des "fauxcolumns-tricks" nicht hinbekomme, das die drei spalten unter firefox komplett mit dem hintergrundimage unterlagt sind. im internetexplorer klappt es soweit, nur das da der inhalt der rechten spalte auf einmal mittig zentriert (also valign="center") angezeigt wird.

an was könnte das alles liegen? und welchen doctype sollte ich verwenden?

zudem sieht die navigation im firefox anders aus, weil freiraum zwischen den spalten gelassen wird...warum das?

danke schonmal für antworten auf diese quälenden fragen..aber es scheint nicht so einfach zu sein mambo annähernd "tablefrei" zu machen

alpendev · #2 (**permalink**) 01.06.2005, 00:12

Hallo timail

Also in deinem doctyp mischt du xhtml und html 4.01 - denk mal das ich gaanz schlecht.

Zitat:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Das ist ein "friedlicher" XHTML-doctyp

Zitat:

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

Wegen layouts (wie zentrierung, etc) sieh mal unter http://www.css4you.de

Ciao Christian

PS: Bin auch grad an Mambo dran. Stylesheets etwas verwirrend, nicht wahr :

timail · #3 (**permalink**) 01.06.2005, 07:12

danke für den hinweis...

naja die mambo styles sind mir soweit geläufig, da ich schon seit längerem mambo templates mit tbles umsetzte. nur leider ist das eben mit divs alles bissl komplizierter, weil man eben das verhalten der boxen steuern muss, wenn dynamischer inhalt reingeldaen wird.

unter http://www.mamboos.de/Mambo_CSS_Guide.html findest du einen kleinen (wenn auch etwas unvollständigen) css-giude zu den default mambo classes.

fragen dazu auch gerne hier.

meintst du, dass es bzgl. meines firefox-problems mit dem doctype zu tuen hat?

timail · #4 (**permalink**) 01.06.2005, 07:17

unter firefox geht das hintergrundbild trotz des "fauxcolumns-tricks" nicht mit und die inhalte überlappen dann das ganze...sieht ziemlich unfein aus...

siehe: http://intranetdasmedienkombinatde.h...line&Itemid=26

im IE gehts...was könnte der fehler sein?

Boris · #5 (**permalink**) 01.06.2005, 09:16

Der "Fehler" ist, dass die Box, die Dein Hintergrundbild enthält, nicht weiter nach unten geht. Sofern Du Deine Leisten mit float positioniert hast (nehm ich jetzt mal an, hab mich nicht durch Deinen Code durchgegraben), musst Du noch ein clear: left; setzen, damit die Box alles umschließt.

timail · #6 (**permalink**) 01.06.2005, 09:35

hallo und danke erstmal...

doch wo soll ich das clear setzen? hier mal meine css der boxen:

Code:

#box {
width:1024px;
margin: 0px auto;
padding:0px;
background: url(../images/main_bg.png) repeat-y 50% 0;
}

#head {
background: url(../images/header.jpg); 
height:136px;
width:1024px;
border-bottom: 1px solid #076AA2;
}

#seperator {
background: url(../images/border.png) repeat-x; 
height: 7px;
width:1024px;
}

#links {
width:151px;
height:440px;
padding:0px;
margin-right:10px;
float:left;
}

#mitte {
width:636px;
float:left;
padding:0px;
} 


#rechts {
width:217px;
height:440px;
padding:0px;
margin-left:10px;
float:right;
}

.clear{
clear:both;
}

und hier die index.php

Code:

<?php echo "<?xml version=\"1.0\" encoding=\"iso-8859-1\"?".">"; ?><?php
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
$iso = split( '=', _ISO );
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!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" xml:lang="de"> 
  <head>
    <?php if ( $my->id ) initEditor(); ?>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <?php mosShowHead(); ?>
<?php echo "<link rel=\"stylesheet\" href=\"$GLOBALS[mosConfig_live_site]/templates/$GLOBALS[cur_template]/css/template_css.css\" type=\"text/css\"/>" ; ?>

<body>


<div id="box">

<div id="head"></div>
<div id="seperator"></div>
	<div id="links"><?php mosLoadModules( 'left' ); ?><?php mosLoadModules( 'user1' ); ?>

         
			
  </div>
			<div id="mitte">
			
			 <div id="content"><?php mosMainBody(); ?>
			  
        </div>
  </div>
   
  <div id="rechts">
		   <div align="center" valign="top"><?php mosLoadModules( 'right' ); ?><?php mosLoadModules( 'user2' ); ?></div>
  </div>
<div style="clear:both;"></div>
<div align="center" style="padding:4px; ">Footer</div>

</div>


</body>
</html>

Boris · #7 (**permalink**) 01.06.2005, 09:53

Versuchs mal im oder nach dem Footer

timail · #8 (**permalink**) 01.06.2005, 10:05

schade funzt nicht

siehe code:

Code:

<?php echo "<?xml version=\"1.0\" encoding=\"iso-8859-1\"?".">"; ?><?php
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
$iso = split( '=', _ISO );
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!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" xml:lang="de"> 
  <head>
    <?php if ( $my->id ) initEditor(); ?>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <?php mosShowHead(); ?>
<?php echo "<link rel=\"stylesheet\" href=\"$GLOBALS[mosConfig_live_site]/templates/$GLOBALS[cur_template]/css/template_css.css\" type=\"text/css\"/>" ; ?>

<body>


<div id="box">

<div id="head"></div>
<div id="seperator"></div>
	<div id="links"><?php mosLoadModules( 'left' ); ?><?php mosLoadModules( 'user1' ); ?>

         
			
  </div>
			<div id="mitte">
			
			 <div id="content"><?php mosMainBody(); ?>
			  
        </div>
  </div>
   
  <div id="rechts">
		   <div align="center" valign="top"><?php mosLoadModules( 'right' ); ?><?php mosLoadModules( 'user2' ); ?></div>
  </div>
<div style="clear:both;"></div>
<div align="center" style="padding:4px; ">Startseite | Impressum | Kontakt</div>
<div style="clear:left;"></div>

</div>


</body>
</html>

timail · #9 (**permalink**) 01.06.2005, 10:07

siehe:

Code:

<div align="center" style="padding:4px; clear:left">Startseite | Impressum | Kontakt</div>

Boris · #10 (**permalink**) 01.06.2005, 10:33

Gib man dem DIV, dass den Hintergrund beinhaltet, zum Test ein overflow: auto; ... hilft das?

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Newsletter - CSS oder tables	tomaso	(X)HTML	10	10.02.2008 12:43
Erstes Design ohne Tables	Wenqu	Site- und Layoutcheck	9	21.07.2007 15:43
Erste Gehversuche mit DIV (keine TABLES)	Krischu	CSS	5	10.08.2006 13:52
Forms (und Anderes) ohne Tables - Pros & Cons?	ollo	CSS	13	04.05.2005 15:35
tables im IE und dessen font-size "problemchen"	biophonc	CSS	7	23.03.2005 19:32