Template quetschen

Status
Nicht offen für weitere Antworten.
R

rollerueckwaerts

Erfahrenes Mitglied
Nachdem ich ein tolles Template für meine fast fertige Site gefunden viel mir auf das die Seite nun im gesamten einfach zu breit ist.

Leider find ich weder was in der CSS dazu noch in der index.php
Dort ist keine width größer als 200 zu finden, kann doch garnicht sein !

Oder gibt es noch ein anderen Weg die Größe der Tabelle in der die ganze Seite steckt zu definieren ?

Vielen lieben dank schonma.

Lg
Tobs

Hier noch ein Auszug der index.php
PHP: 
<?php 
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
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">
<head>
<?php
if ( $my->id ) {
	initEditor();
}
?>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<?php mosShowHead(); ?>
<link rel="stylesheet" type="text/css" href="<?php echo $mosConfig_live_site; ?>/templates/divine/css/template_css.css" />
<script language="JavaScript" type="text/JavaScript">
<!--



function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('<?php echo $mosConfig_live_site; ?>/templates/divine/images/fb2.gif')">
<table width="98"  border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="78%"><img src="<?php echo $mosConfig_live_site; ?>/images/M_images/juicylogo.jpg" alt="header" /></td>
        <td width="22%" valign="bottom"><table width="100%" height="70"  border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td align="right"><span class="footer"><a href="#"><br />
              Contact</a> | <a href="#">Home</a></span>&nbsp;&nbsp;&nbsp;</td>
          </tr>
          <tr>
            <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td></td>
                <td><?php mosLoadModules ( 'user4', -1 ); ?></td>
              </tr>
            </table></td>
          </tr>
        </table>
          </td>
      </tr>
    </table></td>
 
Hi,

mit dem Quellcode-Auszug sieht die Tabelle bei mir so aus:

demo_rollerueckwaerts.jpg

Nicht gerade sonderlich breit.

Und wenn ansonsten keine Breitenangaben definiert sind, wird es vermutlich am Tabelleninhalt liegen, der die Tabelle auseinanderdrückt.
 
Soo .. hab jetz mal 2 Bilder reingepackt.
Die erste Seite ist sichtbar breiter als die 2.
Doch wo kann man die Breite angebenen ? Hätte es halt gerne ein Stück schmaler :)

Pack vorsichtshalber noch die komplette index und css dazu.

HTML: 
<?php 
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
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">
<head>
<?php
if ( $my->id ) {
	initEditor();
}
?>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<?php mosShowHead(); ?>
<link rel="stylesheet" type="text/css" href="<?php echo $mosConfig_live_site; ?>/templates/divine/css/template_css.css" />
<script language="JavaScript" type="text/JavaScript">
<!--



function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('<?php echo $mosConfig_live_site; ?>/templates/divine/images/fb2.gif')">
<table width="98"  border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="78%"><img src="<?php echo $mosConfig_live_site; ?>/images/M_images/juicylogo.jpg" alt="header" /></td>
        <td width="22%" valign="bottom"><table width="100%" height="70"  border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td align="right"><span class="footer"><a href="#"><br />
              Contact</a> | <a href="#">Home</a></span>&nbsp;&nbsp;&nbsp;</td>
          </tr>
          <tr>
            <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td></td>
                <td><?php mosLoadModules ( 'user4', -1 ); ?></td>
              </tr>
            </table></td>
          </tr>
        </table>
          </td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td bgcolor="#CC226E"><?php mosLoadModules ( 'user3', -1 ); ?> </td>
  </tr>
  <tr>
    <td><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images/toplink_bar.gif" alt="header" /></td>
  </tr>
  <tr>
    <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="17" valign="top"><?php if (mosCountModules('left')) { ?>
          <div class="leftmenu">
            <?php mosLoadModules ( 'left' ); ?><a href="http://www.mindiam.com">Mindiam</a><a href="http://www.joomlatemplatestyle.com">Joomla Templates</a><a href="http://www.mindiamhosting.com">Joomla hosting</a>
          </div>
          <?php } ?></td>
        <td width="1" bgcolor="#E9468F"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images/spacer.gif" alt="header" width="1" height="10" /></td>
        <td width="5"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images/spacer.gif" alt="header" width="5" height="10" /></td>
        <td width="100%" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_01.gif" width="13" height="5" alt="" /></td>
            <td background="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_02.gif"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_02.gif" width="595" height="5" alt="" /></td>
            <td><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_03.gif" width="13" height="5" alt="" /></td>
          </tr>
          <tr>
            <td background="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_04.gif"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_04.gif" width="13" height="22" alt="" /></td>
            <td width="100%"><?php mosPathWay(); ?></td>
            <td background="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_06.gif"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_06.gif" width="13" height="22" alt="" /></td>
          </tr>
          <tr>
            <td><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_07.gif" width="13" height="4" alt="" /></td>
            <td background="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_08.gif"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_08.gif" width="595" height="4" alt="" /></td>
            <td><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images//path_09.gif" width="13" height="4" alt="" /></td>
          </tr>
        </table>
        <table width="100%"  border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td><table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td class="newsflash"><?php mosLoadModules( 'top', 1 ); ?></td>
                </tr>
              </table>
                <table width="100%"  border="0" cellspacing="1" cellpadding="1">
                  <tr>
                    <?php if (mosCountModules('user1')) { ?>
                    <td><?php mosLoadModules ( 'user1' ); ?></td>
                    <td><?php } ?>
                        <img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images/spacer.gif" alt="header" width="4" height="1" />
                        <?php if (mosCountModules('user2')) { ?>
                    </td>
                    <td><?php mosLoadModules ( 'user2' ); ?></td>
                    <?php } ?>
                  </tr>
                </table>
                <table width="100%" border="0" align="center" cellpadding="4" cellspacing="0">
                  <tr>
                    <td class="mainpage"><?php mosMainBody(); ?>
                    </td>
                  </tr>
              </table></td>
          </tr>
        </table></td>
        <td width="5"><img src="<?php echo $mosConfig_live_site; ?>/templates/divine/images/spacer.gif" alt="header" width="5" height="10" /></td>
        <td valign="top" bgcolor="#CC226E"><?php if (mosCountModules('right')) { ?>
                    <div class="rightmenu">
                      <?php mosLoadModules ( 'right' ); ?>
                    </div>
          <?php } ?></td>
      </tr>
    </table></td>
  </tr>
</table>

<?php mosLoadModules( 'debug', -1 );?>
</body>
</html>


PHP: 
body {
	margin: 0px;
	background-color:#ffffff;
}

tr, p, div {
  font-family      : Arial, Verdana, Helvetica, sans-serif;
  font-size        : 11px;
  color            : #55484E;
}

a:link, a:visited {
color:#CC226E;
text-decoration: none;
}

a:hover {
color: #FF65AA;
text-decoration: none;
}


hr {
  background       : #999999;
  height           : 1px;
  width            : 80%;
}

.fashion a:link{
	color:#ffffff;
}
.fashion a:visited{
	color:#ffffff;
}
.fashion a:hover{
	color:#EDB5CE;
}


#mainlevel-nav {
margin:0px;
padding:0px;
}
#mainlevel-nav li {
color:#ffffff;
background-image: none;
float:left;
font-size: 12px;
margin:0px 0px 0px 0px;
padding:0px;
}

#mainlevel-nav a {
padding:20px 10px 20px 20px;
line-height:27px;
background-image:url(../images/top_linkside.gif);
background-repeat:no-repeat;
background-position: left;
color:#ffffff;
}

#mainlevel-nav a:hover {
text-decoration:none;
color:#EDB5CE;
background-image:url(../images/top_linkside.gif);
background-repeat:no-repeat;
}

.rightmenu{
  width:185px;
}
.leftmenu{
	width:160px;
}
.newsflash td {
color: #444444;	
align:left;
text-align: justify;
vertical-align: middle;
}
.footer{
	font-size:10px;
	color:#444444;
}
.footer a:link{
	color:#444444;
	font-size:11px;
}

.footer a:visited{
	color:#444444;
}
.footer a:hover{
	color:#B71F63;
}

.mainpage {
text-align: justify;
color: #333333;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 12px;
}

.mainpage-bkg {
	background-image: url(../images/lineborder.gif);
	width: 1px;
}
.pathway{
font-size: 10px;
}

.pathway {
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 10px;
color:#666666;
padding:4px 0px 4px 6px;
}

a.pathway:link, a.pathway:visited {
  color            : #CC226E;
  font-weight      : bold;
}

a.pathway:hover {
  color            : #666666;
  font-weight      : normal;
  text-decoration   : none;
}

.title {
font-family: sans-serif;
font-size: 20px;
font-weight: bold;
color : #000000;
margin-left: 10px;
}

.subtitle {
font-family: sans-serif;
font-size: 10px;
font-weight: bold;
color : #666666;
text-transform: uppercase;
letter-spacing: 2px;
margin-left: 20px;
}

#active_menu {
  color: #CC226E;
  background-image:url(../images/active_link.gif);
}

.mainlevel{
	font-size:12px;
}
a.mainlevel:link, a.mainlevel:visited {
color:#55484E;
font-size: 13px;
font-type: Arial, Helvetica, sans-serif;
display: block;
background-repeat: no-repeat;
padding:0px 0px 0px 10px;
text-decoration: none;
margin:0px;
line-height: 23px;
}
a.mainlevel:hover {
color: #CC226E;

text-decoration:underline;
}

a.mainmenu:link, a.mainmenu:visited {
color: #ffffff; 
font-weight: bold;
font-size: 10px;

}
a.mainmenu:hover {
color: #333333; 
}
.pollstableborder {
border: 1px solid;
padding: 1px;
}

a.sublevel:link, a.sublevel:visited {
        padding-left: 1px;
        vertical-align: middle;
        font-size: 10px;
        color: #377ACB;
        text-align: left;
}


a.sublevel:hover {
color: #013D87; text-decoration: none;
}

table.moduletable {
	margin-bottom: 8px;
	width: 100%;
	border-bottom:1px solid #6D6067;
	padding: 0px;
	background-color:#F2EBEE;
}

table.moduletable th {
	font-size        : 11px;
	font-weight      : bold;
	color            : #222527;
	text-align       : left;
	width            : 100%;
	border:1px solid #777777;
	text-indent: 5px;
	padding: 7px 0px 7px 4px;
	background-image: url(../images/moduletable_bg.gif);
	background-repeat: repeat-x;
}

table.moduletable li {
}

table.moduletable ul {
	padding: 0px;
}
table.moduletable td {
font-size: 10px;
font-weight: normal;
}

.poll {
  font-family      : Arial, Helvetica, sans-serif;
  font-size        : 10px;
  color            : #666666;
  line-height      : 14px;
}

table.pollstableborder {
	border: 1px solid #cccccc;
}

.sectiontableheader {
  background-color : #EEB6D1;
  color            : #333333;
  padding		   :4px;
  font-weight      : bold;
  
}

.sectiontableentry1 {
  background-color : #dddddd;
    padding:2px;
  font-size:11px;
}

.sectiontableentry2 {
  background-color : #eeeeee;
  padding:2px;
  font-size:11px;
  color:#333333;
}

.small {
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-size        : 10px;
  color            : #999999;
  text-decoration  : none;
  font-weight      : bold;
}

.smalldark {
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-size        : 10px;
  color            : #000000;
  text-decoration  : none;
  font-weight      : normal;
}


.contentpane {
}

.contentpaneopen {
  width: 100%;
  padding: 1px;
}



.contentheading, .componentheading {
font-family:"Trebuchet MS", Verdana, Arial, "Bookman Old Style";
  background-image : url(../images/contentheading_bg.gif);
  background-repeat: no-repeat;
  padding-left     :20px;
  font-size        : 14px;
  font-weight      : bold;
  line-height      : 24px;
  text-align       : left;
  color            : #0994D3;
  width            : 100%;
}
.modifydate{
	font-size:10px;
	color:#999999;
}
.createdate {
  font-family      : Arial, Helvetica, sans-serif;
  font-size        : 10px;
  color            : #999999;
  text-align       : left;
}
.readon{
	font-size:10px;
}
.mosimage_caption{
	font-size:10px;
	color:#CC4C4C;
	font-weight:bold;
}

.button {
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-style       : normal;
  font-size        : 10px;
  font-weight      : bold;
  background-color : #0994D3;
  color            : #ffffff;
  border           : 1px solid #CCCCCC;
}

.inputbox {
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-size        : 10px;
  color            : #666666;
  background-color : #ffffff;
  border-top           : 1px solid #666666;
  border-left           : 1px solid #666666;
}



a.contentpagetitle:link, a.contentpagetitle:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
 	color: #ff9900;
	text-align:left;
	text-decoration: underline;
	}

a.contentpagetitle:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-align:left;
	color: #666666;
	text-decoration: none;
	font-weight: bold;
	}

a.category:link, a.category:visited {
  color            : #333333;
  font-weight      : bold;
  font-size: 11px;
font-weight: bold;
}

a.category:hover {
  color            : #999999;
}

.ontab {
	background-color: #ffae00;
	border-left: outset 2px #ff9900;
	border-right: outset 2px #808080;
	border-top: outset 2px #ff9900;
	border-bottom: solid 1px #d5d5d5;
	text-align: center;
	font-weight: bold;
	color: #FFFFFF;
}
.offtab {
	background-color : #e5e5e5;
	border-left: outset 2px #E0E0E0;
	border-right: outset 2px #E0E0E0;
	border-top: outset 2px #E0E0E0;
	border-bottom: solid 1px #d5d5d5;
	text-align: center;
	font-weight: normal;
}
.tabpadding {
}

.tabheading {
	background-color: #ffae00;
	text-align: left;
}

.pagetext {
	visibility: hidden;
	display: none;
	position: relative;
	top: 0;
}

.moscode {
	background-color: #f0f0f0;
}
.code {
	background-color: #f0f0f0;
	border: 1px solid #FFF;
}

.message {
	font-family : Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size : 10pt;
	color : #ff6600;
	text-align: center;
}

.back_button {
  color            : #996600;
  font-family      : Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-size        : 11px;
  white-space      : normal;
  font-weight      : normal;
  padding-bottom   : 4px;
  padding-left     : 11px;
  padding-right    : 2px;
  padding-top      : 1px;
  margin-right     : 4px;
  float            : right;
  font-weight      : normal;
  line-height      : 10px;
  text-decoration  : none; 
}
table.contenttoc {
	color: #333300;
	background-color: #D6ECFA;
	border: 1px solid #EEB6D1;
	padding          : 4px 4px 4px 4px;
	margin-left      : 2px;
	margin-bottom    : 2px;
}

table.contenttoc td {
    font-size: 8pt;
    font-weight: normal;
    text-align:left;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

li {
  line-height: 15px;
  padding-left: 10px;
  padding-top: 0px;
  background-image: url(../images/arrow.gif) ;
  background-repeat: no-repeat;
  background-position: 0px 3px;
}

table.searchinto {
	width: 100%;
}

table.searchintro td {
	background-color: #293C43;
	color: #ffffff;
	font-weight: bold;
}

form {
	margin: 0;
 	padding: 0;
}
 

Anhänge

  • Bild 1.jpg
    Bild 1.jpg
    19,6 KB · Aufrufe: 18
  • Bild 2.jpg
    Bild 2.jpg
    18,9 KB · Aufrufe: 15
Gibt es evtl. eine Online-Version der Seite, denn ohne die Inhalte fällt die Tabelle in sich zusammen und wird in den Browsern unterschiedlich breit dargestellt.

Ansonsten spiel mal mit dem Wert für das width-Attribut in der äußeren Tabelle, die derzeit 98px breit sein soll:

Code: 
<table width="98" border="0" align="center" cellpadding="0" cellspacing="0">
 
Ich vermute jetzt mal, dass sich die Tabellen wegen der eingebundenen Header-Grafiken nicht verschmälern lassen.

Im Template "red_rose_beauty" ist diese beispielsweise 930px breit, und darunter geht dann nunmal nichts.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück