Bug with CSS in dot menu of SessionQuestion.tsx

[abcdefguan]

My console is complaining:

Warning: validateDOMNesting(...): <p> cannot appear as a descendant of <p>.
    in p (at SessionQuestion.tsx:315)
    in div (at SessionQuestion.tsx:310)
    in p (at SessionQuestion.tsx:304)
    in div (at SessionQuestion.tsx:294)
    in div (at SessionQuestion.tsx:292)
    in div (at SessionQuestion.tsx:183)
    in SessionQuestion (at SessionQuestionsContainer.tsx:184)
    in div (at SessionQuestionsContainer.tsx:141)
    in SessionQuestionsContainer (at SessionView.tsx:235)
    in section (at SessionView.tsx:189)
    in SessionView (at SessionView.tsx:269)
    in Unknown (at SplitView.tsx:97)
    in SplitView (created by Context.Consumer)
    in Route (at App.tsx:166)
    in PrivateRoute (at App.tsx:223)
    in Switch (at App.tsx:188)
    in div (at App.tsx:185)
    in Router (created by BrowserRouter)
    in BrowserRouter (at App.tsx:184)
    in Unknown (at src/index.tsx:9)
console.<computed> @ index.js:1
overrideMethod @ react_devtools_backend.js:2273
warningWithoutStack @ react-dom.development.js:558
validateDOMNesting @ react-dom.development.js:9393
createInstance @ react-dom.development.js:9517
completeWork @ react-dom.development.js:20934
completeUnitOfWork @ react-dom.development.js:24676
performUnitOfWork @ react-dom.development.js:24649
workLoopSync @ react-dom.development.js:24614
performSyncWorkOnRoot @ react-dom.development.js:24182
(anonymous) @ react-dom.development.js:12238
unstable_runWithPriority @ scheduler.development.js:815
runWithPriority$2 @ react-dom.development.js:12188
flushSyncCallbackQueueImpl @ react-dom.development.js:12233
flushSyncCallbackQueue @ react-dom.development.js:12221
discreteUpdates$1 @ react-dom.development.js:24365
discreteUpdates @ react-dom.development.js:1486
dispatchDiscreteEvent @ react-dom.development.js:5926
index.js:1 Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>.
    in div (at SessionQuestion.tsx:310)
    in p (at SessionQuestion.tsx:304)
    in div (at SessionQuestion.tsx:294)
    in div (at SessionQuestion.tsx:292)
    in div (at SessionQuestion.tsx:183)
    in SessionQuestion (at SessionQuestionsContainer.tsx:184)
    in div (at SessionQuestionsContainer.tsx:141)
    in SessionQuestionsContainer (at SessionView.tsx:235)
    in section (at SessionView.tsx:189)
    in SessionView (at SessionView.tsx:269)
    in Unknown (at SplitView.tsx:97)
    in SplitView (created by Context.Consumer)
    in Route (at App.tsx:166)
    in PrivateRoute (at App.tsx:223)
    in Switch (at App.tsx:188)
    in div (at App.tsx:185)
    in Router (created by BrowserRouter)
    in BrowserRouter (at App.tsx:184)
    in Unknown (at src/index.tsx:9)

This is caused by nesting a div inside a p in the dot menu that displays "I really don't know" for each session question.

The thing is the quick fix where we change the containing div to p will break the CSS because I think it depends on the tag being a p.

[ngwattcos]

@abcdefguan does this bug still appear?