mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 09:58 Benutzername: Passwort: Auto-Login

Thema: problem mit <form> und suchfeld vom 13.11.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> problem mit <form> und suchfeld
Seite: 1, 2  Weiter
Autor Nachricht
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Do 13.11.2008 17:48
Titel

problem mit <form> und suchfeld

Antworten mit Zitat Zum Seitenanfang

hallo ihr lieben,

ich habe ein problem mit der darstellung des suchfeldes in den verschiedenen browsern.
(siehe im code fette zeile und bilder unten).
wie kann ich es hinkriegen, das das suchfeld in allen browsern gleich erscheint? *Schnief*
im ie 7 ist es meinem "geldgeber" zu weit nach oben gerutscht. aol hat wohl das gleiche problem wie er sagte.
ie 6 und mozilla sind ok.
bin über tipps dankbar. lg

Code:
<div id="suche"><!--code von der suchmaschienengenerierung f&uuml;r den button-->
<form id="SearchForm"  action="sessearch.php">
   <p><input name="enc" type="hidden" value="iso-8859-1"  />
   [b]<input type="text" name="q" size="23" style="position:relative; top:-7px; left:10px;"/>[/b]
   <input type="image" src="http://www.xxx.com/suchbutton.gif" style="position:relative; top:0px; left:15px; "/>
   </p>
</form>
<!--code endet hier--> </div>


Mozilla



Ie 6



Ie 7



css
Code:
#suche
{
   float:left;
   width:355px;
   height:26px;
   padding:0px;
   margin: 0px;
   background-color:#014691;
   overflow:hidden;
}

form
{
   padding:0px;
   margin: 0px;
}

input
{
   padding:0px;
   margin: 0px;
}


Zuletzt bearbeitet von am Do 13.11.2008 17:49, insgesamt 2-mal bearbeitet
 
Smooth-Graphics

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Do 13.11.2008 17:54
Titel

Antworten mit Zitat Zum Seitenanfang

Ich glaube da musst du dann wohl einen ConditionalComment für den IE 7 schreiben:
Code:
<!--[if IE 7]>
#SearchForm input.query {
  margin-top: 2px;
}
<![endif]-->



Bzw. so ähnlich... musst halt anpassen an deinen Code.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Do 13.11.2008 18:32
Titel

Antworten mit Zitat Zum Seitenanfang

super danke, das werde ich mal testen....
 
Snifferdog

Dabei seit: 08.03.2007
Ort: Düsseldorf
Alter: 35
Geschlecht: Männlich
Verfasst Do 13.11.2008 22:11
Titel

Antworten mit Zitat Zum Seitenanfang

Hi,

also vielleicht wirkt das auf dem Bild nur so aber ich finde es sieht so aus als wäre das Inputfeld
beim IE7 insgesamt größer als das im IE6 ... evtl. reicht es ja aus wenn du höhe und border und so noch
einheitlich definierst...bzw erstmal schaust ob die Größe unterschiedlich ist .....
vielleicht kannst du die ConditionalComments so vermeiden.

Gruß
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Do 13.11.2008 23:01
Titel

Antworten mit Zitat Zum Seitenanfang

leider fehlt hier der eigentliche teil von deinem css und html source.

ich denke das CC nicht einmal zum einsatz kommen müßten,
da das problem an einer anderen stelle ist.

//bzw hier wurde das input element einfach nicht ausreichend definiert. wie gesagt zeig mal mehr


Zuletzt bearbeitet von Kash am Do 13.11.2008 23:04, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Do 13.11.2008 23:28
Titel

Antworten mit Zitat Zum Seitenanfang

Kannst du vielleicht ein Beispiel online stellen dann kann man es besser und einfacher beurteilen. Lächel

Zuletzt bearbeitet von m am Do 13.11.2008 23:29, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Mo 17.11.2008 17:49
Titel

Antworten mit Zitat Zum Seitenanfang

Hier könnt ihr die Seite einsehen.

und hier nochmal das komplette css:
Code:

/*----------------------------------Grundlegendes------------------------------------------*/
html
{
   padding:0px;
   margin:0px;
}

/*grundlegende einstellungen*/
body
{
   background-color: #ffffff;
   margin:0px;
   padding:0px;
   font-size: 12px;
   font-family: Arial, Verdana, SunSans-Regular, Sans-Serif;
}

/*umschliesst das gesamte layout*/
#box
{
   width:955px;
   height:auto;
   margin:0% auto;
   padding:0px;

}



/*----------------------------------Kopf------------------------------------------*/

/*der kopf*/
#head
{   
   width:955px;
   height:74px;
   margin:0px;
   padding:0px;
}

#suche
{
   float:left;
   width:355px;
   height:26px;
   padding:0px;
   margin: 0px;
   background-color:#014691;
   overflow:hidden;
}

form
{
   padding:0px;
   margin: 0px;
}

input
{
   padding:0px;
   margin: 0px;
}

form p
{
   padding:0px;
   margin: 0px;
}


#nav1
{   
   float:left;
   width:600px;
   height:26px;
   padding:0px;
   margin: 0px 0px 0px 0px;
}

/* die liste, die die elemente f?r nav2 beinhaltet*/
#nav1 ul
{
   margin:0px 0px 0px 0px;
   padding: 0px;
   list-style-type: none;
}

/*aktives nav1 listenelement
#nav1 li.active
{
   }*/

/*(NICHT aktives) nav1 listenelement*/
#nav1 li
{
   width:100px;
   height:26px;
   float: left;
   margin: 0px;
   padding: 0px;
   list-style-type: none;
   display:block;
}

/*(NICHT aktives) nav1 listenelement*/
#nav1 ul li a img
{
border: 0px none;
}


/*----------------------------------Linker Teil------------------------------------------*/

/*die linke spalte, welche das linke menü enthalt*/
#links
{
   width:170px;
   height:762px;
   margin: 10px 10px 0px 0px;
   padding:0px;
   float:left;
   background-color:#F3F4F3;
}

/* der kasten mit formularu nd blauem hintergrund drin*/
.kasten_a
{
   height:18px;
   width:161px;   
   margin:0px;
   padding: 2px 0px 0px 9px;
   background-color:#014691;
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   font-weight: bold;
   color:#fff;
   float: left;
}

.nav2
{   
   float:left;
   width:170px;
   height:127px;
   padding:0px;
   margin: 3px 0px 0px 0px;
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
}

/* die liste, die die elemente f?r nav2 beinhaltet*/
.nav2 ul
{
   margin:0px 0px 0px 0px;
   padding: 0px;
   list-style-type: none;
}

/*aktives nav1 listenelement
.nav2 li.active
{
   }*/

/*(NICHT aktives) nav1 listenelement*/
.nav2 li
{
   width:161px;
   height:15px;
   float: left;
   margin: 0px;
   padding: 5px 0px 0px 9px;
   list-style-type: none;
   display:block;
}

/*(aktives) nav1 listenelement*/
.nav2 li a
{
   color:#000;
   text-decoration:none;
}

/*(aktives) nav1 listenelement*/
.nav2 li a:hover
{
   color:#000;
   text-decoration:underline;
}


.nav2 li img
{
   padding-right:3px;
}

.nav2 li a img
{
   border:0px none;
}

/* der kasten mit sonderinfos und blauem hintergrund drin*/
.kasten_b
{
   height:18px;
   width:161px;   
   margin:0px;
   padding: 2px 0px 0px 9px;
   background-color:#014691;
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   font-weight: bold;
   color:#fff;
   float:left;

}



/* der kasten mit newsletter oberer teil*/
.kastennewsletter_a
{
   height:23px;
   width:161px;
   margin:275px 0px 0px 0px;
   padding: 4px 0px 0px 9px;
   background-color:#fff;
   float:left;
   border-top: 1px solid #014691;
   border-bottom: 1px solid #014691;
   font-family: Arial, Verdana, Sans-serif;
   font-size:16px;
   font-weight: bold;
   color:#014691;
}

/* der kasten mit newsletter unterer teil*/
.kastennewsletter_b
{
   height:57px;
   width:161px;   
   margin:0px;
   padding: 3px 0px 0px 9px;
   background-color:none;
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   color:#014691;
   float:left;
}

/* der kasten mit newsletter unterer teil*/
.kastennewsletter_b a
{
   color:#014691;
   text-decoration:underline;
}

/* der kasten mit newsletter unterer teil*/
.kastennewsletter_b a:hover
{
   color:#014691;
   text-decoration:underline;
   font-weight:bold;
}

/* der kasten mit newsletter oberer teil*/
.kastenexpress_a
{
   height:23px;
   width:161px;   
   margin:5px 0px 0px 0px;
   padding: 4px 0px 0px 9px;
   background-color:#fff;
   float:left;
   border-top: 1px solid #014691;
   border-bottom: 1px solid #014691;
   font-family: Arial, Verdana, Sans-serif;
   font-size:16px;
   font-weight: bold;
   color:#014691;
}

/* der kasten mit newsletter unterer teil*/
.kastenexpress_b
{
   height:57px;
   width:161px;   
   margin:0px;
   padding: 3px 0px 0px 9px;
   background-color:none;
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   color:#014691;
   float:left;
}

/* der kasten mit newsletter unterer teil*/
.kastenexpress_b a
{
   color:#014691;
   text-decoration:underline;
}

/* der kasten mit newsletter unterer teil*/
.kastenexpress_b a:hover
{
   color:#014691;
   text-decoration:underline;
   font-weight:bold;
}


/*---------------------------------Mittelteil------------------------------------------*/

/*der mittelteil*/
#main
{   
   width:561px;
   height:762px;
   margin:10px 10px 0px 0px;
   padding: 0px 0px 0px 0px;
   float:left;
   background-color:#014691;
   position:relative;
}

.main_kasten_a
{   
   width:554px;
   height:30px;
   margin:7px 0px 0px 7px;
   padding: 3px 0px 0px 0px;
   background-color:#F3F4F3;
}

/* schriftformatierung für die schlagworte in der mitte ganz oben*/
h1
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   margin:0px 0px 0px 0px;
   padding: 2px 0px 0px 0px;
   color:#014691;
   text-align:center;
}

h2
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:8px;
   margin:0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   color:#000;
   text-align:center;
}

h3
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:11px;
   font-weight: bold;
   color:#014691;
   margin:0px 0px 0px 7px;
   padding: 3px 0px 0px 0px;
   text-align:left
}

h4
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:14px;
   font-weight: bold;
   color:#014691;
   margin:0px 0px 0px 7px;
   padding: 7px 0px 0px 0px;
   text-align:left
}

h4 a
{   
   text-decoration:underline;
   color:#014691;
}

h4 a:hover
{   
   color:#000;
}

h5
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:18px;
   font-weight: bold;
   color:#014691;
}

h6
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   color:#014691;
   margin:0px 0px 10px 0px;
   padding:0px;
   font-weight:bold;
}


/* diese auszeichnung wird auch für die pdfs im unteren teil verwendet*/
.artikeltext
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   color:#014691;
   margin:0px;
   padding:0px;
   font-weight:normal;
}

.artikeltext a
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   color:#014691;
   margin:0px;
   padding:0px;
   font-weight:normal;
   text-decoration: none;
}

.artikeltext a:hover
{   
   text-decoration: underline;
   font-weight:normal;
}



.main_weisserbalken
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   font-weight: bold;
   width:554px;
   height:18px;
   margin:7px 0px 0px 7px;
   padding: 0px 0px 0px 0px;
   background-color:#fff;
   float:left;
   display:inline;
}

.kastengrau1
{   
   width:182px;
   height:119px;
   margin:0px 0px 0px 7px;
   padding: 0px 0px 0px 0px;
   background-color:#F3F4F3;
   float:left;
   display:inline;
}

.kastengrau2
{   
   width:182px;
   height:119px;
   margin:0px 0px 0px 4px;
   padding: 0px 0px 0px 0px;
   background-color:#F3F4F3;
   float:left;
   display:inline;
}

.kastengrau3
{   
   width:182px;
   height:119px;
   margin:0px 0px 0px 4px;
   padding: 0px 0px 0px 0px;
   background-color:#F3F4F3;
   float:left;
   display:inline;
}

.weisserbalken2
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   font-weight: bold;
   width:274px;
   height:30px;
   margin:7px 0px 0px 7px;
   padding: 0px 0px 0px 0px;
   background-color:#fff;
   float:left;
   display:inline;
}


.kastenblaetterkatalog
{   
   width:273px;
   height:276px;
   padding: 0px;
   background-image: url('bilder/blaetterkatalog.jpg');
   background-repeat: no-repeat;
   float:left;
   display:inline;
   margin:7px 0px 0px 7px;
}

.kastennews
{   
   width:274px;
   height:276px;
   margin:7px 0px 0px 7px;
   padding: 0px 0px 0px 0px;
   background-color:#F3F4F3;
   float:left;
   display:inline;
}

.weisserbalken2
{   
   width:274px;
   height:30px;
   margin:0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   background-color:#fff;
}

.kasteninhaltnews
{   
   width:274x;
   height:246px;
   margin:0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   background-color:#F3F4F3;
}

.news1
{   
   width:120px;
   height:113px;
   margin:0px 0px 0px 0px;
   padding: 10px 0px 0px 10px;
   float:left;
   overflow:hidden;

}

.news2
{   
   width:115px;
   height:118px;
   margin:0px 0px 0px 0px;
   padding: 5px 0px 0px 15px;
   float:left;
   overflow:hidden;
}

.news3
{   
   width:125px;
   height:108px;
   margin:0px 0px 0px 0px;
   padding: 15px 0px 0px 10px;
   float:left;
   overflow:hidden;
}

.news4
{   
   width:105px;
   height:113px;
   margin:0px 0px 0px 0px;
   padding: 10px 0px 0px 25px;
   float:left;
   overflow:hidden;
}








/*---------------------------------Rechter Teil------------------------------------------*/
/*die rechte leiste*/
#rechts
{   
   width:204px;
   height:762px;
   margin:10px 0px 0px 0px;
   padding:0px;
   float:left;
   background-color:#014691;
   display:inline;
}


.verlaufbox
{   
   width:182px;
   height:110px;
   margin:10px 0px 0px 13px;
   padding:0px;
   float:left;
   display:inline;
}

.verlaufbox h1
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:24px;
   font-weight: bold;
   color:#fff;
   padding: 25px 0px 0px 60px;
   margin:0px 0px 0px 0px;
   text-align:left;
}

.verlaufbox h2
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:14px;
   font-weight: bold;
   color:#fff;
   padding: 3px 0px 0px 10px;
   margin:0px 0px 0px 0px;
   text-align:left;
}

.verlaufbox h3
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   font-weight: normal;
   color:#fff;
   padding: 0px 0px 0px 10px;
   margin:0px;
   text-align:left;
}

.iconbox
{   
   width:182px;
   height:70px;
   margin:9px 0px 0px 13px;
   padding:0px;
   float:left;
   display:inline;
}

.iconbox h1
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   font-weight: bold;
   color:#014691;
   padding: 5px 0px 0px 55px;
   margin:0px 0px 0px 0px;
   text-align:left;
}

.iconbox h2
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:9px;
   font-weight: bold;
   color:#000;
   padding: 3px 0px 0px 55px;
   margin:0px 0px 0px 0px;
   text-align:left;
}

.iconbox h2 a
{   
   text-decoration:underline;
   color:#000;
}

.iconbox h2 a:hover
{   
   color:#014691;
}


/*---------------------------------Unterer Teil------------------------------------------*/
/*die untere leiste*/
#unten
{   
   width:955px;
   height:auto;
   margin:10px 0px 0px 0px;
   padding:0px 0px 10px 0px;
   float:left;
   background-color:#F3F4F3;
}

#unten h1
{   
   width:955px;
   height:23px;
   margin:0px 0px 0px 0px;
   padding:7px 0px 0px 0px;
   float:left;
   background-color:#014691;
   color:#fff;
   font-family: Arial, Verdana, Sans-serif;
   font-size:12px;
   font-weight: bold;

}

#unten h2
{   
   margin:0px 0px 0px 0px;
   padding:7px 0px 0px 0px;
   color:#fff;
   font-family: Arial, Verdana, Sans-serif;
   font-size:80px;
   font-weight: bold;
}

#unten h3
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   color:#014691;
   margin:0px;
   padding:0px;
   font-weight:bold;
}

.box_unten
{   
   width:179px;
   margin:0px 0px 0px 0px;
   padding:10px 0px 0px 10px;
   float:left;
}



.footer
{   
   width:955px;
   height:auto;
   margin:0px 0px 0px 0px;
   padding:0px 0px 10px 0px;
   clear:left;
   background-color:#F3F4F3;
   border-top:1px solid #014691;
}

/* schriftformatierung für die schlagworte im footer*/
.footer h1
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:10px;
   margin:0px 0px 0px 0px;
   padding: 10px 0px 0px 0px;
   color:#014691;
   text-align:center;
}

.footer h2
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:9px;
   margin:10px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   color:#000;
   text-align:center;
}

.footer h2 a
{   
   text-decoration:none;
   color:#000;
}

.footer h2 a span
{   
   text-decoration:underline;
}

.box_unten p
{   
   margin:0px 0px 0px 0px;
   padding:10px 0px 0px 10px;
}

/*für die auszeichnung der großbuchstaben am anfgang*/
.box_unten span
{   
   font-size:16px;
}

.footer h3
{   
   font-family: Arial, Verdana, Sans-serif;
   font-size:9px;
   margin:10px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   text-align:center;
}

.footer h3 a
{   
   color:#A09999;
}


Zuletzt bearbeitet von am Mo 17.11.2008 19:03, insgesamt 4-mal bearbeitet
 
Snifferdog

Dabei seit: 08.03.2007
Ort: Düsseldorf
Alter: 35
Geschlecht: Männlich
Verfasst Mo 17.11.2008 19:48
Titel

Antworten mit Zitat Zum Seitenanfang

Hi,

also bei mir siehts überall gleich aus ...




Gruß


Zuletzt bearbeitet von Snifferdog am Mo 17.11.2008 19:49, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen form mailer problem ?
Problem form-Tag im Popup Fenster?
Problem mit <form> und höhe in ie --------solved
[C4d] Eigene Form + Textur = Problem
[SOLVED] Userfriendly URLs -> Form Problem
[solved]CSS Problem im IE bei form input und label
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.