Zum Inhalt springen

Probleme mit HTML- Template und externer CSS Datei

Erstellt am 8. August 2005 · 6 Antworten · letzte Antwort am 8. August 2005

Tags: HTML & CSS, Frage

acidwr ·

Hallo Leute,

bin gerade dabei, ein eigenes Template für unseren Verein zu bauen.
Hab die HTML- Seite fertig, hochgeladen und bin nun dabei das Design und den Inhalt anzupassen http://www.bruechert-online.de/typo3/.

Ich möchte eine externe css Datei (im Fileadmin- Verzeichnis) benutzen um unter anderem einen Scrollbalken in meine Tabellezelle zu bekommen (Design soll statisch sein), bekomme das aber irgendwie nicht hin!

Irgendwie erkennt Typo meine css nicht... oder muss ich auch im "Template Setup" mit Typoscript drauf verweisen? Wenn ja, wie?

Danke für eure Hilfe

Gruss

Sebastian

Anlage: HTML des Templates + TypoScript

<?xml version="1.0" encoding="iso-8859-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="en" lang="en">
<head>
<title>stickfight_template</title>

<link rel="stylesheet" type="text/css" href="fileadmin/templates/stick_style.css" />


</head>

<body eftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="width:100%; height:100%; vertical-align: middle;">

###DOKUMENT###

<table style="width:100%; height:100%; margin:0px; overflow:auto">
 <tr>
  <td>
  

<table id="table_body" width="760" height="580" border="0" cellpadding="0" cellspacing="0" align="center" style="overflow:auto ">
	<tr>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_01.jpg" width="38" height="102" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_02.jpg" width="536" height="102" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_03.jpg" width="171" height="102" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_04.jpg" width="15" height="102" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_05.jpg" width="38" height="27" alt="" /></td>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_06.jpg">###NAVI1###</td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_07.jpg" width="171" height="27" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_08.jpg" width="15" height="27" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_09.jpg" width="38" height="17" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_10.jpg" width="536" height="17" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_11.jpg" width="171" height="17" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_12.jpg" width="15" height="17" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_13.jpg" width="38" height="53" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_14.jpg" width="536" height="53" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_15.jpg" width="171" height="53" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_16.jpg" width="15" height="53" alt="" /></td>
	</tr>
	<tr>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_17.jpg"></td>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_18.jpg" valign="top">###HAUPTTEXT###</td>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_19.jpg" valign="top">###NEWS###</td>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_20.jpg" width="15" height="329"></td>
	</tr>
	<tr>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_21.jpg"></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_22.jpg" width="536" height="24" alt="" /></td>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_23.jpg"></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_24.jpg" width="15" height="24" alt="" /></td>
	</tr>
	<tr>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_25.jpg" width="38" height="28" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_26.jpg" width="536" height="28" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_27.jpg" width="171" height="28" alt="" /></td>
		<td>
			<img src="fileadmin/templates/images/HP_Verein_800_600_slice_28.jpg" width="15" height="28" alt="" /></td>
	</tr>
</table>

 </td>
 </tr>
</table>


###DOKUMENT###
</body>
</html>
# Menu 1 cObject
  temp.NAVI1 = HMENU 

# First level menu-object, textual
  temp.NAVI1.1 = TMENU
  temp.NAVI1.1 {

# Normal state properties
  NO.allWrap = |  |   |*| |  |   |*| |

# Enable active state and set properties:
   #ACT = 1
   #ACT.allWrap = <div class="menu1-level1-act"> | </div>
}




# Default PAGE object:
seite = PAGE
seite.typeNum = 0
seite.bodyTag = <body>
seite.5 = TEMPLATE
seite.shortcutIcon = fileadmin/templates/test1.ico

seite.5 {
           template = FILE
           template.file = fileadmin/templates/stickfight_template.html
           workOnSubpart = DOKUMENT
           
# Substitute the ###menu_1### subpart with dynamic menu:
subparts.NAVI1 < temp.NAVI1
           
            
           marks.HAUPTTEXT = CONTENT
           marks.HAUPTTEXT.table = tt_content
}
woodyp ·

Hallo Sebastian,

Das Stylesheet muss im Templete mit eingebunden werden.

z.B.

page = PAGE
page {
typeNum = 0
<body bgcolor0 "#FFFFFF" topmargin0 "0">
#sowie alle anderen allgemeinen Seiteneigenschaften
stylesheet = fileadmin/xyz.css

Gruß
Woody

woodyp ·

Hallo Sebastian,

genau gesagt würde ich es bei deinem Template so probieren

seite = PAGE
seite.typeNum = 0
seite.bodyTag = <body>
seite.shortcutIcon = fileadmin/templates/test1.ico
seite.stylesheet = fileadmin/xyz.css

seite.5 = TEMPLATE
seite.5 {

etc.....

Gruß
Woody

acidwr ·

Ok,

das mit dem css hab ich hin bekommen!
Danke

Eine Frage habe ich noch:

Ich bekomme einfach keinen Scrollbalken in meinem HAUPTTEXT hin!
http://www.bruechert-online.de/typo3/index.php?id=20 da soll einer hin, damit das Design erhalten bleibt!

Hab es schon mit "overflow" in der <td> getestet, geht aber nicht...

Kann mir bitte jemand anhand meines Codes oben noch einen Tip geben?

Danke

mstuebner ·
acidwr schrieb

Hab es schon mit "overflow" in der <td> getestet, geht aber nicht...

Dann hast Du etwas falsch gemacht. overflow: scroll;

acidwr ·

Hallo,

nein hab nur zu schnell geschrieben. Tut mir leid!

Also mein code sieht jetzt so aus:

<tr>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_17.jpg"></td>
		
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_18.jpg" valign="top"><div style="width:100%; height:100%; align:center; valign:top; background-color:transparent; overflow:auto;">###HAUPTTEXT###</div> </td>
		
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_19.jpg" valign="top">###NEWS###</td>
		<td background="fileadmin/templates/images/HP_Verein_800_600_slice_20.jpg" width="15" height="329"></td>
	</tr>

Bei overflow:scroll zeigt er die balken ja immer, sollen aber nur bei Bedarf da sein.
Wenn ich dies schreibe (overflow:scroll) geht es im IE aber im Firefox zeigt er die Balken aber zeigt trotzdem den gesamten Seiteninhalt (also sind die da ohne Funktion) !?

So wie im Code funktioniert das jetzt, allerdings nur im IE. Firefox zeigt mir keine Scrollbalken. Wäre mir wichtig!

Danke