Anzeige

<form>

<form> | PSD-Tutorials.de

Erstellt von AukeArts, 08.05.2011.

  1. AukeArts

    AukeArts Guest

    <form>
    Guten Tag zusammen,
    ich habe mal wieder ein kleines Problem. Ich möchte eine Suchleiste einbauen...soweit klappt das auch und das verändern der Größe etc. mit CSS kriege ich auch hin, jedoch habe ich mit dem submit Button ein kleines Problem. Ich habe es mit einem Bild gestauscht...jedoch zentriert es sich nicht.
    Mit CSS komme ich im Moment auch nicht wirklich weiter.

    So sieht es bisher aus.

    http://www.abload.de/img/searchbardkai.jpg

    Wie kriege ich das hin ?

    Hier der Code, auch wenn er nicht so relevant ist.

    HTML:
    1. <form name="search">
    2. <input type="text" class="textfeld">
    3. <input type="image" src="template/searchbar/search_lupe.png" class="button">
    4. </form>
    HTML:
    1. .textfeld {
    2.     height:24px;
    3.     -moz-border-radius:7px;
    4.     margin-left:25px;
    5.     }
     
    #1      
  2. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    <form>
    AW: <form>

    am einfachsten ist das ganze mal uploaden und ein link zu der Sache.
    So wie es ist, gibt es keine Möglichkeit etwas dazu zu sagen (beim css weiss man nicht, ob irgendetwas resettet ist, beim der inputgrafik weiss man nicht wie gross diese ist... die formatierung des .textfeld hilft allein irgendwie gar nicht weiter.)
    wenn das input(textfeld) 24px hoch ist, und die Grafik passend dazu ist, und etwaige margins paddings etc resettet sind, sollte sich das problem nicht ergeben.
    (btw.: ich würde die searchboxfeldoptik im Hüllelement form als Hintergrund setzen und die inputs mittels margins darin anordnen - dann kannst du die -moz-webkit-bla-border-radien vergessen, und es sieht auch in IEs gleich aus.)
     
    Zuletzt bearbeitet: 08.05.2011
    #2      
  3. kleeaar

    kleeaar zwo-eins-risiko!

    1
    Dabei seit:
    26.03.2008
    Beiträge:
    2.766
    Geschlecht:
    männlich
    Kameratyp:
    Samsung GX 1L
    <form>
    AW: <form>

    schiebs doch einfach mit margin-top um die gewissen pixel nach unten...
    Dann ist es vertical zentriert!

    Grüße
     
    #3      
  4. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    <form>
    AW: <form>

    vertikale margins haben keinen effekt bei inline Elementen.
     
    #4      
  5. AukeArts

    AukeArts Guest

    <form>
    Zuletzt von einem Moderator bearbeitet: 08.05.2011
    #5      
  6. kleeaar

    kleeaar zwo-eins-risiko!

    1
    Dabei seit:
    26.03.2008
    Beiträge:
    2.766
    Geschlecht:
    männlich
    Kameratyp:
    Samsung GX 1L
    <form>
    AW: <form>

    ok, aber in diesem Falls müsste dann ja vertical-align:middle; seinen zweck erfüllen...

    Grüße
     
    #6      
  7. AukeArts

    AukeArts Guest

    <form>
    AW: <form>

    Das war´s.

    Vielen Dank euch beiden und einen schönen Abend noch.

    Mit freundlichen Grüßen,
    AukeArts
     
    #7      
x
×
×