Wie zeige ich in React zwei verschiedene Container nebeneinander an?-Fragen und Antworten zum chinesischen PHP-Netzwerk

Ich möchte das Bestellfeld und das Bestellmenü nebeneinander platzieren, es handelt sich um zwei verschiedene Komponenten (Container). In meinem CSS habe ich display:inline-block und flex-direction:row ausprobiert. Ich habe Flex für die übergeordnete Komponente (Order) ausprobiert, aber dadurch wird die Breite beider Komponenten verringert. Das ist so eine einfache Sache, aber ich kann es nicht tun. Kann mir jemand helfen, den Fehler zu finden?

import React from „react“; Container importieren aus „@material-ui/core/Container“; Stack importieren von „@mui/joy/Stack“; OrderPanel aus „./OrderPanel“ importieren; OrderMenu aus „./OrderMenu“ importieren; import „./Order.css“; Funktion Order() { zurückkehren ( <>    
  ); }; Standardreihenfolge exportieren; import React von „react“; Container importieren aus „@material-ui/core/Container“; Stack importieren von „@mui/joy/Stack“; OrderPanel aus „./OrderPanel“ importieren; import „./Order.css“; Funktion OrderMenu() { zurückkehren ( <>  Bestellmenü 
  ); } Standard-OrderMenu exportieren; import React aus „react“; Container importieren aus „@material-ui/core/Container“; Stack importieren von „@mui/joy/Stack“; import „./Order.css“; Bestellung aus „./Order“ importieren; Funktion OrderPanel() { zurückkehren ( <>  Auftragsbereich 
  ); } Standard-OrderPanel exportieren;

.Order { Hintergrundfarbe:Dunkelkhaki; Höhe: 50 %; Flexrichtung: Reihe; } .Order-Panel{ Hintergrundfarbe: Beige; Rand links: 2vw; Rand rechts: 60vw; Rand oben: 2vh; Höhe: 60vh; Breite: 50 Vh; Flexrichtung: Reihe; Anzeige: Inline-Block; } .Bestellmenü{ Hintergrundfarbe: Aquamarin; Rand oben: 2vh; margin-left:2vw; Höhe: 10 vw; Breite: 45vh; Anzeige: Inline-Block; Flexrichtung: Reihe; }