HTML/CSS Newbie benötigt Hilfe!

[Looom]

Hallo,

Seit einiger Zeit benutze ich Joomla als CMS, mit welchem ich auch sehr zufrieden bin und gut klarkomme.
Für einen Freund habe ich im PhotoShop ein Template gebaut, welches ich jetzt gesliced habe.
Einige Probleme gibts noch:

unter crownskull.looom.de könnt ihr euch das Template ansehen, um welches es geht.
Das Template habe ich nicht komplett selbst erstellt, sondern es baut auf dem "recipes"-Template auf - ist jedoch sehr stark verändert.
Die Menü-Leiste dient nur zu Testzwecken und ist noch nicht funktionsfähig, daher das Behelfs-Menü, welches sich über den Spielkarten-Symbolen befindet.

Wie ihr seht spackt es noch an allen Ecken und Enden.

Ich würde gerne:

• Den Text im Main-Content "einrücken", damit er nicht mehr über den Rand hinausragt: Habe es mit padding-right und left versucht, jedoch wird dann das Hintergrundbild ebenfalls eingerückt.
  Gibts ne Möglichkeit, wirklich nur den Text einzurücken? Hab schon versucht, alles extra in ein DIV zu packen und zu padden aber mit dem gleichen Ergebnis (Bild wird mit eingerückt und passt dann nicht mehr...)
  
  Ausschnitt aus der Index.php (Template)
  

  <table  cellspacing="0" border="0" width="900">
          <tr>
           <td colspan="2" id="header">
                     <img src="<?php echo $mosConfig_live_site; ?>/templates/crownskull/images/blank.gif" width="900" height="180">
             <div id="example9h">
             <!-- BEGIN MENU -->
             <div class="navhorzcontainer">
             <?php echo $mycssONLY_PRI_menu ?></div>
             </div>
             <br>                    
           </td>
          </tr>
                  
             <tr>
  
                   <td valgin="top"  id="linksnavi"> 
                   </td>
  
                   <td rowspan="2" valign="top" id="main">
          
                    <?php mosloadmodules('top'); ?>
            <?php mosMainBody(); ?>
            <?php mosloadmodules('banner'); ?>
            </div>
                   </td>
                 
          </tr>
          <tr>
                   <td valgin="top"  id="linkgirl"> </td>
                  </tr>
          <tr>
           <td colspan="2" id="footer"></div></td>
          </tr>
      </table>

  
  Ausschnitt aus der CSS-Datei des Templates:
  

  body {
      margin: 0px;
      background: #000000;
      
  }
  
  #main{    
  background: url(../images/crownskull_03crownskull.jpg) repeat-y;
  width:635px;
  
  
  padding-left:24px;
  padding-right:0px;
  
  }
  
  #linksnavi{
  background: url(../images/crownskull_02crownskull.jpg) no-repeat;
  
  width:265px;
  height: 261px;
  }
  
  #linkgirl{
  background: url(../images/crownskull_left03.jpg) no-repeat;
  
  width:318px;
  height: 127px;
  }
  
  #header{
  background: url(../images/crownskull_header.jpg) no-repeat;
  width: 900px;
  height: 237px;
  }
  
  #hauptcontent{
  padding-left:130px;
  padding-right:130px;
  }
  
  #footer{
  background: url(../images/crownskull_footer.jpg) no-repeat;
  padding-top:3px;
  height: 75px;
  }

  
  
• Kann ich die Zelle mit dem Mädchen (rechts unten, unter dem "Navi-Dummy") so ausrichten, dass sie am Footer "klebt", d.h. dass sie nicht in der Mitte hängt, wenn der Inhalt im MAIN-Bereich länger wird ? Ich hoffe jemand weiss was ich meine.

Ich hoffe, jemand schaut es sich mal durch und kann mir einige Vorschläge geben. Ist es überhaupt sinnvoll, das Ganze mit Tabellen zu lösen oder sollte ich auf DIVs "umbauen" ?

Habe leider ziemlich wenig Erfahrung, aber jeder hat mal angefangen - learning by doing. Sobald das Template funktioniert, wie ich es mir vorstelle, werde ich es hier natürlich zur freien Verfügung posten wenn Interesse besteht.

Danke schonmal für eure Hilfe + Vorschläge, wurde mal ein etwas umfangreicherer Post, aber lieber alles in einem als 1000 verschiedene Posts und ich denke, das Template ist auf jeden Fall mal was anderes.

Basti

Mod-Edit: PHP-Code-Tags und normale Code-Tags hinzugefügt - :shock: Alles von Hand gehighlighted? Wie sinnlos. Benutze beim nächsten mal einfac [NOPARSE]

[/NOPARSE] (Artemis)

 

[Artemis]

So,

Ist es überhaupt sinnvoll, das Ganze mit Tabellen zu lösen oder sollte ich auf DIVs "umbauen" ?

Nein, es ist nicht sinnvoll, das mit Tabellen zu lösen. Tabellen sind zur strukturierung und Aufbereitung von Daten.
Leider werden Tabellen oft von Anfängern (aber auch von (vermeintlichen) Profis) zum Designen benutzt, weil das schön einfach ist.

Wenn du die Seite Trennen möchtest, also auf der einen Seite der Inhalt (in der HTML-Datei (in dem Fall der HTML-Teil des Templates)) und auf der anderen das Design (mittels CSS) solltest du auf DIV umsteigen.

 

[Looom]

Ja.. sehr gut - dachte ich mir nämlich auch.

kann ich dann bei DIVs auch ein "hintergrundbild" angeben ? Also hinten Bild, vorne Text ? Vielleicht is das ne sehr sehr dumme Frage aber kann mich nur wiederholen - jeder hat mal irgendwie angefangen....


Danke fürs ansehen!

 

[Artemis]

Ja, mit der CSS-Eigenschaft background-image.