dargestellte Breite von 'select' vs. 'input'

[Gunnar Bittersmann]

@@alle:

Markup:

<select>  
  <option>foo</option>  
</select>  
<br/>  
<input type="text"/>

Stylesheet:

input, select  
{  
  background-color: silver; /* damit man was sieht */  
  border-width: 0;  
  padding: 0;  
  width: 42px;  
}

Die Boxen von 'select' und 'input' sind gleich breit.

Gibt man aber 'border-width' oder 'padding' von 0 verschiedene Werte, ist die 'input'-Box breiter als die 'select'-Box. Bei der 'input'-Box werden 'border-width' und 'padding' entsprechend dem Box-Modell hinzugerechnet; bei der 'select'-Box nicht.

Gibt es dafür eine andere Erklärung außer „Browser haben ihre eigenen Vorstellungen von Formularelementen“?

Live long and prosper,
Gunnar

[dedlfix]

echo $begrüßung;

Bei der 'input'-Box werden 'border-width' und 'padding' entsprechend dem Box-Modell hinzugerechnet; bei der 'select'-Box nicht.
Gibt es dafür eine andere Erklärung außer „Browser haben ihre eigenen Vorstellungen von Formularelementen“?

Die Select-Box wird meist mit einer betriebssystem- beziehungsweise GUI-abhängigen Komponente dargestellt, und da sind mitunter die Gestaltungsmöglichkeiten begrenzt.

Du kennst vielleicht auch das Problem, dass sich eine Select-Box auch nicht unbedingt an den z-index hält sondern trotzdem über allen Elementen liegt (in bestimmten Browsern).

echo "$verabschiedung $name";

[Dr.Colossos]

Hi,

ja, kenn ich, hab ich auch mal Tage lang versucht zu "fixen" ... geht nicht so weit ich weiß, außer eben border und padding = 0.

Die border lässt sich evtl. noch mit einem umschließenden Element simmulieren ... padding ... hmmm ... Pech gehabt.

Lustig wirds aber erst so richtig wenn du das auch noch in verschiedenen Browsern probierst ...