Lightswitch HTML - Bildschirm überstreckt

Question

Ich habe schon eine Weile bemerkt, dass bei Verwendung von Lightswitch und der Einstellung von Eigenschaften auf "Auf Container dehnen" der Bildschirm manchmal überstreckt erscheint und Elemente in die nächste Zeile verschiebt zum Beispiel:

Beim Drücken der "Meine Projekte entsprechen Nur" die Tasten umschalten (so verstecke ich diese und zeigt die andere Option“, um den folgenden Code verwendet:

if (screen.ChangeDefaultValue.count> 0) { screen.ChangeDefaultValue.selectedItem = screen.ChangeDefaultValue.data [0];

screen.ChangeDefaultValue.selectedItem.HomepageProjectsDefault = false; 

    screen.DefaultOption = null; 

    myapp.applyChanges(); 

    setTimeout(function() { 
     screen.Projects.refresh(); 
    }, 100); 

    screen.findContentItem("SeeAllProjects").isVisible = false; 
    screen.findContentItem("SeeMyProjectsOnly").isVisible = true; 
} 
else { 

} 

Das funktioniert perfekt, aber wie Sie oben im zweiten Bild sehen können, bewegt sich die Taste unterhalb dem Parameter-Suchfeld nach unten, als ob es überdehnt gewesen ist. Ich habe versucht, den Rand und das Padding des .msls-Inhalts zu ändern, aber dieser Fehler tritt immer noch hier und auf mehreren meiner anderen Seiten auf.

Hat jemand eine Lösung für dieses Problem gefunden?

Weitere Informationen:

• I msls-2.5.3.css bin mit und wird in der Datei default.htm erklärt
• ich diesen https://social.msdn.microsoft.com/Forums/vstudio/en-US/fb1305c5-ac13-474e-8ae0-df74ebf12590/html-client-custom-control-stretch-to-container-sizing-bug-problem?forum=lightswitch

DAS PROBLEM versucht haben,

dieser kleine Block des Codes in der msls-2.5.3.css scheint jedoch das Problem zu sein Wenn ich es ausdenke, brechen andere Bildschirme. alle die Polsterung in der Höhe scheint zu verschwinden, und sie alle überlappen einander auf den Modal-Bildschirme

.msls-clear { 
    clear: both; 
} 

Answer 1

In Light HTML können wir Spalten-Layout-Option verwenden, um die Kontrolle in jeder Spalte zu machen. Wenn Sie die Eigenschaft "Auf Container erweitern" setzen, wird die Spalte nur auf Containergröße gestreckt, und nicht das Steuerelement in jeder Spalte wird mit Container gestreckt. Die Steuerelemente werden ordnungsgemäß im Container gerendert. Problem tritt aufgrund der Spaltenbreite auf, wenn das Inhaltselement ausgeblendet und angezeigt wird und dies nicht mit der auf der Seite verwendeten Komponente zusammenhängt. Befolgen Sie die folgende Problemumgehungslösung, während Sie das Inhaltselement dynamisch entfernen, indem Sie auf die Schaltfläche klicken.Bitte entfernen Sie die Klasse 'msls-clear' beim Klicken auf die Schaltfläche oder wenden Sie clear: none auf die Klasse 'msls-clear' an. this.element.parents(".msls-column").next(".msls-clear").removeClass("msls-clear")

Hoffe, das wird Ihnen helfen ..!

Danke, Francis

Answer 2

Im kein Experte in CSS, aber dies scheint meine Probleme behoben zu haben:

.msls-clear { 
    clear: right; 
    max-width: 1850px; 
} 

alle Die Maschinen, die ich getestet habe, haben eine Auflösung von 1920 x 1080. Durch eine leichte Verkleinerung der Breite werden die Objekte nie überstreckt.

Ich habe ursprünglich die clear: right; kommentiert, die im Internet Explorer arbeitete, jedoch habe ich einige Syncfusion Kontrollen in Google Chrome/Firefox getestet. Ich konnte auf keinen von ihnen klicken und musste daher die maximale Breite hinzufügen.

Wenn jemand eine bessere Lösung vorschlagen, wäre ich dankbar, aber zumindest für jetzt funktioniert diese