/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Drilagtigt problem - IE contra andre brows~
Fra : Bertel Lund Hansen


Dato : 25-04-06 09:28

Hej alle

Jeg har lavet et søgefelt på Fidusos sider. Der er samme søgning
på alle siderne, og det er Googles sitesøgning der ligger bag.
Det er fint nok.

Tekstfeltet og knappen ligger i titellinjen og skal gerne være
tæt sammen. Det kommer de automatisk i Opera og FF.

I IE havde jeg tidligere justeret afstanden, og det har jeg atter
indført for at I kan se problemet. Det gør jeg med:

<!--[if IE]>
   <style>
      .search .submitbutton { margin-left: 3em; }
   </style>
<![endif]-->

idet de andre browsere får 5em i stedet. Det bevirker imidlertid
at tekstfeltet opfører sig sært i IE. Prøv at pege på det. I
hele feltet får man titlen frem (Søg på Fiduso), men kun til
venstre skifter cursoren om og tillader at man sætter fokus på
feltet. Hvis man prøver det til højre er det bare knappen der
skifter farve.

Jeg 'løste' problemet ved at lade form-felterne omslutte af
<span> (problemområdet reduceres til nogle millimeter men
forsvinder faktisk ikke helt), men det validerer ikke i strict.
Når jeg laver det validt med <p> i stedet for, kommer problemet.

Hvad kan jeg gøre?

Som sagt kan problemet ses på alle Fidusos sider, men her er den
kodestumpt der sætter formularen op:

<div class='search'>
<form name='google' method='get' action='http://www.google.com/search' accept-charset='utf-8'>
<p class='textfield'><input type='text' name='q' size='10' maxlength='255' title='Søg på Fiduso'></p>
<p><input type='hidden' name='as_sitesearch' value='fiduso.dk'></p>
<p class='submitbutton'><input type='submit' value='Søg på Fiduso'></p>
</form>
<p class='centreret'><?= $title ?></p>
</div>

--
Bertel
http://bertel.lundhansen.dk/      http://fiduso.dk/

 
 
Bertel Lund Hansen (25-04-2006)
Kommentar
Fra : Bertel Lund Hansen


Dato : 25-04-06 13:21

Bertel Lund Hansen skrev:

> idet de andre browsere får 5em i stedet. Det bevirker imidlertid
> at tekstfeltet opfører sig sært i IE. Prøv at pege på det. I
> hele feltet får man titlen frem (Søg på Fiduso), men kun til
> venstre skifter cursoren om og tillader at man sætter fokus på
> feltet. Hvis man prøver det til højre er det bare knappen der
> skifter farve.

Jeg har fundet to måder at løse problemet på.

1. Sæt knappen til at være label for tekstfeltet. Det er lidt
ulogisk, men det fjerner problemet fuldstændigt.

2. Pak alle <input>tene ind i en <div> og giv dem hver en <span>
i stedet for en <p>. Det validerer og fjerner næsten problemet.

Hvis man er ligeglad med afstanden mellem tekstfelt og knap, kan
man bare lave et megamellemrum, men det vil sjældent være
brugbart.

--
Bertel
http://bertel.lundhansen.dk/      http://fiduso.dk/

Allan Vebel (25-04-2006)
Kommentar
Fra : Allan Vebel


Dato : 25-04-06 22:23

Bertel Lund Hansen skrev:

> Jeg har fundet to måder at løse problemet på.

Jeg kom med en tredje mulighed som du ikke har prøvet
endnu, den med position:absolute;

Det kræver at du har helt styr på margin på de øvrige
elementer. Der er en smule forskel i forskellige browsere
hvor bred din lysegule kant er, og de skulle gerne ramme
samme sted i det røde felt.

Jeg har selv brugt løsningen med fint resultat.

--
Allan Vebel
http://html-faq.dk



Søg
Reklame
Statistik
Spørgsmål : 177501
Tips : 31968
Nyheder : 719565
Indlæg : 6408527
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste