From 37d9ed65468c2f684a8eaf07342840564fa4a408 Mon Sep 17 00:00:00 2001
From: navedqb <109583873+navedqb@users.noreply.github.com>
Date: Wed, 17 Jan 2024 01:38:01 +0530
Subject: [PATCH] fixes float label demo in multiselect (#5783)

---
 components/doc/multiselect/floatlabeldoc.js | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/components/doc/multiselect/floatlabeldoc.js b/components/doc/multiselect/floatlabeldoc.js
index 03800f9f41..86dea1f58f 100644
--- a/components/doc/multiselect/floatlabeldoc.js
+++ b/components/doc/multiselect/floatlabeldoc.js
@@ -15,8 +15,8 @@ export function FloatLabelDoc(props) {
 
     const code = {
         basic: `
-<span className="p-float-label">
-    <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full md:w-20rem" />
+<span className="p-float-label w-full md:w-20rem">
+    <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full" />
     <label htmlFor="ms-cities">Select Cities</label>
 </span>
         `,
@@ -36,8 +36,8 @@ export default function FloatLabelDemo() {
 
     return (
         <div className="card flex justify-content-center">
-            <span className="p-float-label">
-                <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full md:w-20rem" />
+            <span className="p-float-label w-full md:w-20rem">
+                <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full" />
                 <label htmlFor="ms-cities">Select Cities</label>
             </span>
         </div>
@@ -65,8 +65,8 @@ export default function FloatLabelDemo() {
 
     return (
         <div className="card flex justify-content-center">
-            <span className="p-float-label">
-                <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full md:w-20rem" />
+            <span className="p-float-label w-full md:w-20rem">
+                <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full" />
                 <label htmlFor="ms-cities">Select Cities</label>
             </span>
         </div>
@@ -81,8 +81,8 @@ export default function FloatLabelDemo() {
                 <p>A floating label appears on top of the input field when focused.</p>
             </DocSectionText>
             <div className="card flex justify-content-center">
-                <span className="p-float-label">
-                    <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full md:w-20rem" />
+                <span className="p-float-label w-full md:w-20rem">
+                    <MultiSelect value={selectedCities} onChange={(e) => setSelectedCities(e.value)} options={cities} optionLabel="name" maxSelectedLabels={3} className="w-full" />
                     <label htmlFor="ms-cities">Select Cities</label>
                 </span>
             </div>