zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Buttons von einem "fertigen" cgi formatieren

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 16.11.2006, 20:26
Benutzerbild von sveniboy
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.03.2005
Beiträge: 63
sveniboy befindet sich auf einem aufstrebenden Ast
Standard Buttons von einem "fertigen" cgi formatieren

Hallo zusammen,
ich habe ein großes Prob mit einem fertigen CGI von Domainfactory. Es handelt sich um einen Formmailer. Nun möchte ich die Sende und Löschen Buttons meinem Design anpasssen. Hier fängt es dann an....beim Firefox geht es und beim IE klappt es nicht Ich muss dazu sagen, dass es Buttons mit "Hover-Effekt" sind. Tut aber eigentlich nix zur Sache, da ich welche auch in meiner Navi habe und hier keine Probleme mit dem IE habe. Habt Ihr mir vielleicht nen Tipp, an was es liegen kann. Wie muss ich die Zeile formatieren, dass ich einen Hover-Button im IE hinbekomme?
Code:
<input type="SUBMIT" name="Submit" value="Senden" class="form11">
Bin für jeden Tipp dankbar.
Creez sveni

Edit:
Hier habe ich zur Ergänzung mein HTML
Code:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<link href="css/cont06.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="content">
<div class="box_re">
	<form action="/system-cgi/formmail.pl" method="post">
	<input type="hidden" name="recipient" value="EMAIL">
	<input type="hidden" name="subject" value="Kontaktformular">
	<input type="hidden" name="required" value="Vorname,Name,email,nachricht">
	<div class="box_re3">
		<label for="Name" class="label">Name*:</label>
		<label for="Vorname" class="label">Vorname*:</label>
		<label for="Firma" class="label">Firma;</label>
		<label for="Strasse" class="label">Strasse & Nr.:</label>
		<label for="PLZ" class="label">PLZ:</label>
		<label for="Ort" class="label">Ort:</label>
		<label for="email" class="label">E-Mail*:</label>
		<label for="Telefon" class="label">Telefon:</label>
	</div><!--ende box_re3-->
			<div class="box_re2">
				<input type="text" id="Name" name="Name" size="30" class="input"><br>
				<input type="text" id="Vorname" name="Vorname" size="30" class="input"><br>
				<input type="text" id="Firma" name="Firma" size="25" class="input"><br>
				<input type="text" id="Strasse" name="Strasse" size="30" class="input"><br>
				<input type="text" id="PLZ" name="PLZ" size="5" class="input"><br>
				<input type="text" id="Ort" name="Ort" size="30" class="input"><br>
				<input type="text" id="email" name="email" size="30" class="input"><br>
				<input type="text" id="Telefon" name="Telefon" size="30" class="input"><br>
			</div><!--ende box_re3-->
		<div class="box_re3">
				<label for="Betreff" class="label">Betreff:</label>
				<label for="nachricht" class="label">Ihre Nachricht*:</label>
		</div><!--ende box_re3-->
		<div class="box_re2">
			<input type="text" id="Betreff" name="Betreff" size="40" class="input"><br>
			<textarea name="Ihre Nachricht" id="nachricht" rows="10" cols="29" class="input2"></textarea>
			</div><!--ende box_re2-->
				<p class="p_bem">Felder mit * müssen ausfefüllt werden</p>
		<ul class="form10">
			<li class="form11"><input type="SUBMIT" name="Submit" value="Senden" class="form11"></li>
			<!--<li class="form11"><input type="SUBMIT" name="Submit" value="Senden" class="form11"></li>-->
		</ul><!--ende form-->
		</form>
	</div><!--Ende Box re-->
</div><!--Ende Content-->
</body>
</html>
Und hier mein CSS
Code:
/*Stylesheet Contentbereich Contact Stand 131106*/
/*Allgemeine Anweisungen (Text, Tabelle, Überschriften, etc.)*/
/*Hier sind  die spezifischen Anweisungen für das 2Spalten-Design angegeben (höhenabhängige Anweisungen)*/
#content {
	border-color: Black;
	border-style: solid;
	border-width: 1px;
	background-color: White;
	width: 765px;
	height: 1460px;
	margin: auto;
}

.textbox {
	border-color: Green;
	border-style: solid;
	border-width: 1px;
	width: 320px;
	height: 500px;
	float: left;
	/*padding: 0;
	margin: 0;*/
}

/*Box für die Hintergrundfarbe in der linken Spalte*/
.textbox2 {
	border-color: Green;
	border-style: solid;
	border-width: 1px;
	background-color: #E0F0FF;
	width: 245px;
	padding-left: 30px;
}

/*Trennbalken senkrecht zwischen li und re Spalte*/
.balken01 {
	background-image: url(../grafiken/trennb_senkr.jpg);
	background-repeat: repeat-y;
	width: 1px;
	height: 1460px;
	float: left;
	margin-top: 0;
}

.balken03 {
	/*border-color: Red;
	border-style: solid;
	border-width: 1px;*/
	background-image: url(../grafiken/rahmen-li.jpg);
	background-repeat: repeat-y;
	width: 5px;
	height: 1460px;
	float: left;
	padding: 0;
	margin: 0;
}

.balken04 {
	/*border-color: Red;
	border-style: solid;
	border-width: 1px;*/
	background-image: url(../grafiken/rahmen-re.jpg);
	background-repeat: repeat-y;
	width: 5px;
	height: 1460px;
	float: right;
	margin-top: 0;
}

.balken05 {
	background-image: url(../grafiken/rahmen_unten.jpg);
	background-repeat: repeat-x;
	width: 745px;
	height: 5px;
	padding: 0;
	overflow: hidden;
	float: left;
	clear: right;
}

/*Diese Anweisung wird benötigt, damit der Pfeil im Navibutton (Header) bei aktivem 
Zustand erhalten bleibt. Diese Anweisung muss bei jeder Site seperat zugewiesen werden*/
li .a6:visited {
	background-image: url(../grafiken/header/b_kont.jpg);
	background-repeat: no-repeat;
	background-position: 0 -29px;
	width: 115px;
	height: 29px;
}

/*----------------------------Definition des Formularbereiches---------------------------------------*/

/*Box für die Formularbezeichnungen, damit sich die Formularfelder zuum Ausfüllen re neben der ersten
Beschreibung ausrichten*/

/*Definition des gesamten re Bereichs (Formularbereich)*/
.box_re {
	border-color: Blue;
	border-style: solid;
	border-width: 1px;
	background-image: url(../grafiken/back02.jpg);
	background-repeat: repeat;
	width: 400px;
	height: 600px;
	float: left;
}

/*Box für die Formularfelder zum Ausfüllen, damit eine gleichmäßige Linksausrichtung gewährleistet ist*/
.box_re2 {
	border-color: Blue;
	border-style: solid;
	border-width: 1px;
	float: left;
	margin-top: 30px;
}

/*Box für die Formularbezeichnungen*/
.box_re3{
	/*border-color: Red;
	border-style: solid;
	border-width: 1px;*/
	float: left;
	clear: left;
	margin-top: 30px;
	padding: 0;
	width: 115px;
}

/*Definition der Formularbezeichnungen*/
.label {
	/*border-color: Blue;
	border-style: solid;
	border-width: 1px;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: normal;
	font-style: normal;
	text-align: left;
	color: Black;
	float: left;
	clear: left;
	display: inline;
	margin-top: 5px;
	margin-bottom: 6px;
	margin-left: 20px;
	white-space: nowrap;
}


/*Definition der Formularbezeichnungen*/
.form01 {
	/*border-color: Blue;
	border-style: solid;
	border-width: 1px;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: normal;
	font-style: normal;
	text-align: left;
	color: Black;
	float: left;
	clear: left;
	display: inline;
}

/*Definition der Formularfelder zum Ausfüllen*/
.input {
	/*font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: normal;
	font-style: normal;
	text-align: left;
	color: Black;*/
	float: left;
	clear: left;
	display: inline;
	/*border-style: solid;
	border-width: 1px;
	border-color: Blue;*/
	margin-top: 5px;
	margin-bottom: 0px;
	margin-left: 10px;
	height: auto;
}

/*Definition des Nachrichtenfelds zum Ausfüllen*/
.input2 {
	/*font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: normal;
	font-style: normal;
	text-align: left;
	color: Black;*/
	float: left;
	clear: left;
	display: inline;
	/*border-style: solid;
	border-width: 1px;
	border-color: Blue;*/
	margin-top: 5px;
	margin-bottom: 0px;
	margin-left: 10px;
}

/*Definition für Pflichtfelder des Formulars*/
.p_bem {
	border-style: solid;
	border-width: 1px;
	border-color: Blue;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	font-style: normal;
	text-align: center;
	color: Black;
	float: left;
	display: inline;
	margin-left: 125px;
	margin-top: 10px;
	padding: 0;
}

/*-----------------------------Definition der Formularbuttons Senden und Löschen---------------------*/

ul.form10 {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

li submit {
	border-color: Black;
	border-style: solid;
	border-width: 1px;
	font-size: 10px;
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	text-indent: 15px;
	line-height: 25px;
	vertical-align: middle;
	color: Black;
	display: block;
}

/*Defintion des Button-Hover-Active-Effekts*/
li .form11 {
	background-image: url(../grafiken/form_buttons_kompl1.jpg);
	background-repeat: no-repeat;
	width: 65px;
	height: 25px;
}

li .form11:hover, li .form11:active {
	background-image: url(../grafiken/form_buttons_kompl1.jpg);
	background-repeat: no-repeat;
	background-position: 0 -25px;
	width: 65px;
	height: 25px;
}

/*
li input {
	background-image: url(../grafiken/form_buttons_kompl1.jpg);
	background-repeat: no-repeat;
	width: 65px;
	height: 25px;	
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: normal;
	text-align: center;
	color: Black;
	text-decoration: none;
	line-height: 25px;
	vertical-align: middle;
	margin: 0;
	float: left;
	color: Black;
	display: block;
}
*/
Hier sieht man dann im IE, dass der HOvereffekt nicht funzt Hat jemand nen Tipp? Danke vielmals.

Geändert von sveniboy (16.11.2006 um 21:44 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.11.2006, 10:06
Benutzerbild von duessu
{blubb /}
XHTMLforum-Mitglied
 
Registriert seit: 05.09.2005
Beiträge: 371
duessu befindet sich auf einem aufstrebenden Ast
Standard

Der IE unterstütz kein Hover aus bei a-tags

http://xhtmlforum.de/42993-uberall-f...ie6-nicht.html
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 17.11.2006, 21:48
Benutzerbild von sveniboy
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.03.2005
Beiträge: 63
sveniboy befindet sich auf einem aufstrebenden Ast
Standard

Ohje.....so ein mist. Heist das übersetzt, dass ich nur den Hover-Effekt bei Links hinbekomme. Diese setzte ich ja üblicherweise in a-Tags. In meinem Fall ist es ja kein Link Gibt es da einen Trick außer Javascript?
Mit Zitat antworten
  #4 (permalink)  
Alt 18.11.2006, 19:50
Benutzerbild von sveniboy
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.03.2005
Beiträge: 63
sveniboy befindet sich auf einem aufstrebenden Ast
Standard

Weis denn keiner nen Tipp für mich??? Bin ratolos...benötige einen "Gedankenanstoß"
Danke
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
<UL> in Paragraph formatieren mramse CSS 3 03.05.2009 14:39
Apache 2, virtual hosts Scheppertreiber Serveradministration und serverseitige Scripte 0 31.03.2008 20:32
Gästebuch formatieren Electrohunter CSS 1 29.10.2007 18:19
Problem mit dem Menü [erledigt] Julian CSS 2 16.01.2006 00:27
Problem mit Buttons / Hintergrund - Felder verschieben!? Hisky CSS 3 10.05.2005 21:42


Alle Zeitangaben in WEZ +2. Es ist jetzt 23:07 Uhr.