For eksempel: At / user / login inkluderer indtastningsfelterne for brugernavn og adgangskode en HTML-attributstørrelse = “60”.
I Bartik har felterne en fast bredde.
I Bootstrap , strækkes felterne for at udfylde hele skærmbredden.
Efterspurgt adfærd: Jeg vil gerne få Bootstrap til at adlyde størrelsesattributten – til / bruger / login og på hver eneste anden side på hjemmesiden. Jeg er ikke i stand til at generere en liste over alle de berørte sider, da der er mange, og den vil ændre sig over tid.
Det ser ud til, at noget i Bootstrap SCSS ødelægger bredderne på inputfelter. Jeg vil gerne slette det eller tilsidesætte det. Men det lykkedes mig endnu ikke at finde ud af, hvordan man gør det.
Hvad jeg indtil videre har fundet: Der er allerede et -problem på Drupal.org , hvor modulvedligeholder markcarver siger
Årsagen til, at de “strakte” sig i fuld bredde er, at de begge har en formkontrolklasse. Dette er en del af Bootstraps design, og jeg vil ikke bekæmpe det uden for kassen. Der er flere måder at ændre denne form på, som du finder passende, i et undertema.
Hvad der delvist fungerer, men ikke 100% rigtigt: Det ville være muligt at skrive CSS for at indstille en ny bredde på alle indgange med formkontrolklasse af typen tekst. Det er godt, men det indstiller bredden til en fast værdi såsom 15em. Jeg vil gerne hente den oprindelige bredde tilbage, som vil være forskellig på hvert input.
Kommentarer
- Jeg spekulerer på, hvorfor ikke ' t skal du bare rette dette med CSS ???
- @leymannx Jeg har præciseret, se " EDIT 2 ". Ja, jeg forventer at rette det med CSS, men jeg leder efter en enkelt ændring, der dækker alle felter. Hvis du ved, hvordan du gør det, bedes du sende / kommentere.
- Hvis den person, der stemte ned, kan forklare hvorfor, så måske kunne jeg lære noget og stille bedre spørgsmål i fremtiden
- Didn ' t nedstemme, men jeg gætte, det skete, fordi du faktisk stiller et alt for bredt spørgsmål og ikke ' ikke fremhæver alt, hvad du selv har gjort indtil videre for at løse dette problem alene. Bortset fra det, når du kan rette det med CSS og spørge os, hvordan man gør det, så er dette spørgsmål også uden for emnet. Vi vandt ' t lærer dig, hvordan du opretter et undertema, og vi lærer ikke ' t, hvordan du skriver robust CSS. Der er allerede hundreder af tutorials derude, der dækker det. Held og lykke! 🙂
- @leymannx Tak. Faktisk stiller jeg et meget specifikt spørgsmål, men jeg antager, at jeg har forklaret det dårligt. Jeg ' Jeg prøver endnu en redigering. Men måske skal jeg bare slette spørgsmålet, da det forårsager forvirring.
Svar
Standardmetoden til at rette dette er at bruge css i dit Bootstrap-baserede undertema. Til loginfelterne for brugernavn og adgangskode:
#edit-name, #edit-pass { width: 15em; } NB Jeg leder efter en løsning, der dækker alle form for input, ikke kun brugerlogin som et specielt tilfælde.
Du kan bruge denne metode (css) til hvert tekstinputfelt, hvor du vil tilsidesætte Bootstraps standardadfærd. Det er klart, at du skal bruge den rigtige css-vælger til det felt, du vil tilsidesætte.
Kommentarer
- Tak, fordi du tog dig tid til at svare. Se min " EDIT 2 " – jeg håber at undgå at skulle identificere hvert enkelt felt, der kan blive berørt fra sag til sag da det ikke er praktisk eller vedligeholdeligt
- input og mål efter formkontrolklasse af typen tekst?
- @kevin, undskyld, men jeg forstår ikke spørgsmålet.
- i stedet for at bruge ider, kan du bare målrette input med den klasse, der er af typen ' tekst '.
- @Kevin tak, ja det ligner mere det, jeg håbede på. Det ser dog ud til, at jeg stadig vil sidde fast med en fast bredde som 15em. Jeg foretrækker at beholde den faktiske bredde, der er angivet i # størrelse. Jeg vil gerne " fortryde " uanset hvad Bootstrap gjorde for at tilsidesætte bredderne og hente den nøjagtige samme bredde, som forekommer i Bartik.
Svar
Jeg havde håbet på et svar fra og ekspert og ville stadig byde det velkommen – jeg ville være glad for sæt accepter et andet svar i stedet for mit.
Her er mit bedste forsøg hidtil. Det ser ud til at fungere for login-siden og søgeblokken. Men jeg føler stadig, at jeg kæmper med et system, jeg ikke har. forstår ikke fuldt ud.
.form-control, .input-group .form-control, .input-group-btn { width: auto; }