zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Fehler bei horizontaler Ausrichtung von Formularelementen und Button-Hover im FF

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 15.01.2009, 07:22
Benutzerbild von kopfaquarium
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.01.2007
Ort: Berlin
Beiträge: 16
kopfaquarium befindet sich auf einem aufstrebenden Ast
Standard Fehler bei horizontaler Ausrichtung von Formularelementen und Button-Hover im FF

Hallo,

ich versuche derzeit krampfhaft ein kleines Suchformular mit zwei Buttons vernünftig zu positionieren (siehe beigefügtem Screenshot). Im Safari/Chrome funktioniert die Positionierung sehr gut und auch der Hover-Zustand bei den Buttons funktioniert.

Bei dem Firefox (neueste Version) gibt es sowohl ein Problem mit der Positionierung (das Input-Feld ist zu tief), als auch das er den Hover-Zustand nicht anzeigt. FF schreibt zu dem Hover-Problem folgendes in seiner Fehlerkonsole:

Zitat:
Warnung: Fehler beim Verarbeiten des Wertes für Eigenschaft 'background'. Deklaration ingoriert
Allerdings schreibt FF in der Fehlerkonsole viele Fehler (auch von funktionierenden Website) und der betreffende Code validiert. Kann Firefox überhaupt bei Buttons den Hover-Zustand?

Ich werde wohl eh auf zwei Varianten zurückgreifen müssen: Eine gestylte und eine wo ich die Formularelemente so belasse, da ich bei anderen Browsern (z.B. Mozilla Camino) noch weitere Probleme festgestellt habe, denn die ignorieren die Background-Eigenschaft komplett.

Hier der betreffende Code:
HTML
HTML-Code:
    <div class="span-14 searchbox"> <!-- start searchbox -->
      <form action="#" id="searchform" method="get">
        <input name="standort" type="submit" class="btn_standort" value="Standort" />
        <label for="q">Gebe einen Ort oder Bezeichnung ein …</label>
        <input name="q" id="q" type="text" class="text" />
        <input name="suchen" type="submit" class="btn_suchen" value="Suchen" />
      </form>
      <p class="pp_Notes">Hier kommt zusätzlich ein Hinweis bzgl. der zwei Buttons hin. Der Hinweis wird angezeigt, wenn das Formularfeld aktiv ist.</p>
    </div> <!-- end searchbox -->

CSS
Code:
   /**
    * Formatierung Suchbox
    *
    * @subsection layout
    */
    input.text, input.title, textarea, select {
      border: 3px solid #195073;
      color: #666;
      height: 19px;
      width: 298px;
      font-size: 0.9em;
    }
    
    /*
      FIXME Darstellungsfehler der Hover-Darsetllung bei Buttons im FF fixen.

      Background wird nicht geladen.
    */
    
    input.text:focus, input.title:focus, textarea:focus, select:focus { border: 3px solid #f7de07; }
    input.btn_standort {
      text-indent: -999em;
      background: url('../../images/btn_standort.png') top left;
      width: 94px;
      height: 35px;
      border: none;
    }
    input.btn_standort:hover { background: url('../../images/btn_standort.png') 71px left; }
    input.btn_standort:active { background: url('../../images/btn_standort.png') bottom left; }
    input.btn_suchen {
      text-indent: -999em;
      background: url('../../images/btn_suchen.png') top left;
      width: 94px;
      height: 35px;
      border: none;
    }
    input.btn_suchen:hover { background: url('../../images/btn_suchen.png') 71px left; }
    input.btn_suchen:active { background: url('../../images/btn_suchen.png') bottom left; }

Viele Grüße,
Christian
Angehängte Grafiken
Dateityp: jpg browser.jpg (15,2 KB, 4x aufgerufen)
__________________
Meine Website: www.beier-christian.eu
Mein Weblog: www.beier-christian.eu/blog/
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
background, button, firefox, formular, inbut

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
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 13:25
Hilfe css Menu center xXcyberXx CSS 5 28.11.2010 20:51
Problem mit CSS Menü SMundt CSS 9 07.01.2009 20:12
CSS Navigation - Problem mit IE6 pcklinik CSS 4 18.09.2007 13:04
CSS Einsteiger bittet um Hilfe pcklinik CSS 0 06.09.2007 15:40


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:39 Uhr.