Breite von "select" Feld

[carlos]

Hallo,

ich hab ein Problem mit der Formatierung von "select"-Feldern eines Formulars:
die Breite wird nach Bedarf dargestellt, soll aber eine feste Breite haben.
die relevanten Format-Definitionen sind meiner Meinung nach:

input,
select,
textarea {
    border:1px solid #ccc;
    font-size:15px;
}

und

select {
    width:300px;
    height:30px;
    font-size:15px;
}

ich kann jetzt leider keinen Link posten, da es ein geschützter Bereich ist.

ich hab das vor gut einem Jahr eingerichtet und hat funktioniert, hab mich aber seit langem nicht mehr gekümmert, kann das an Contao-Updates liegen?

ist mit IE, FF und Chrome gleich.

wenn sich das jemand genauer anschauen möchte, schicke ich Zugangsdaten per PN

Danke & Grüße

Karl

[Kahmoon]

Was sagt denn Firebug? Siehst du da deine Styles? select müsste eigentlich schon passen. Zumindest klappt das bei 3.3 auch noch

Ist das entsprechende CSS im Layout aktiviert?

Vg
Frank

[carlos]

Hallo,

hab mal nochmal geschaut (zwar nicht mit Firebug sondern Chrome-Inspect:
anscheinend hat das Element die richtige Breite aber nicht die Select-Box
css-error.JPG

rechts wird angezeigt:

element.style {
opacity: 0;
margin-bottom: 4px;
}
select {
width: 300px;
height: 30px;
font-size: 15px;
}
input, select, textarea {
border: 1px solid #ccc;
font-size: 15px;
}
select, input[type="file"] {
display: block;
}
select, input, textarea {
font-size: 99%;
}
user agent stylesheetkeygen, select, select[size], select[size="1"] {
border-radius: 0px;
border-color: rgb(169, 169, 169);
}
user agent stylesheetselect {
-webkit-appearance: menulist;
box-sizing: border-box;
align-items: center;
border: 1px solid;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
white-space: pre;
-webkit-rtl-ordering: logical;
color: black;
background-color: white;
cursor: default;
}
user agent stylesheetkeygen, select {
border-radius: 5px;
}
user agent stylesheetinput, textarea, keygen, select, button {
margin: 0em;
font: -webkit-small-control;
color: initial;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: start;
}
user agent stylesheetinput, textarea, keygen, select, button, meter, progress {
-webkit-writing-mode: horizontal-tb;
}
Inherited from table
user agent stylesheettable {
display: table;
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}

weiß jetzt nicht genau ob der Codeblock weiterhilft.
CSS ist auf alle Fälle im layout eingebunden

[Kahmoon]

Was ist denn das "user agent stylesheetinput" und "user agent stylesheetselect" alles?

Lösch das mal alles raus und schau obs dann geht.

[carlos]

hmm,

eingetragen hab ich das Zeug sicher nicht. steht auch nicht in meinen Definitionen. wird das durch irgendeine Funktion generiert?

[Kahmoon]

Das kann ich dir nicht pauschal beantworten. Sieht nicht nach Contao CSS aus.

In Firebug kann man diese Styles zumindest nach und nach deaktivieren und somit testen ob das die Ursache ist.

[carlos]

ok, werd mal versuchen das mit Firebug hinzubekommen, auf den ersten Blick tu ich mich noch schwer die Selectbox zu lokalisieren.
meld mich wieder

Danke schon mal!

karl

edit: doch geschafft, das zeigt mir Fire-Bug an:

element.style {
    opacity: 0;
}
select {
    font-size: 15px;
    height: 30px;
    width: 300px;
}
input, select, textarea {
    border: 1px solid #CCCCCC;
    font-size: 15px;
}
select, input[type="file"] {
    display: block;
}
select, input, textarea {
    font-size: 99%;
}
body {
    font-size: 100.01%;

da tauchen diese ominösen Objekte gar nicht auf

[Kahmoon]

So sollte das eigentlich auch gehen.

[carlos]

bin mir ja ziemlich sicher: als ich das vor ca einem Jahr eingerichtet habe, hat das auch so ausgesehen wie gedacht, da werde ich auf alle Fälle schon die 3er gehabt haben, aber wohl nocht nicht die 3.2.

Achja, was mir noch einfällt: das ist ein efg-Formular, könnte das ein Problem der Erweiterung sein?

[Kahmoon]

Glaube ich nicht. Das ist ja ganz banales CSS. Aber müsste ich live sehen damit ich da mehr dazu sagen kann.

VG

[carlos]

hab Dir eine PN geschickt

[carlos]

Damit Kollegen mit evtl gleichem Problem geholfen ist:

Die Antwort von Kahmoon:
"Die Klasse .styled_select braucht die 300px"

Dafür hier nochmal herzlichen Dank

[Kahmoon]

.styled_select ist aber keine Contao Klasse sondern eine eigene.

VG