score:0
ok, it was fixed by using materialgrid and adding some styles (display: "flex", height: "80px", justifycontent: "space-between")
score:0
from the screenshot, it looks like you're displaying a table in a dialog. from this conclusion it is suggested -
to embed your 'table' component inside 'dialogcontent'
the button should be right aligned on the dialog, meaning your buttons should be placed inside 'dialogactions'
i created a sandbox with some mock data (due to insufficient details in the question) - have a look - https://codesandbox.io/embed/material-dialog-actions-qcrnx
score:1
mixing material ui dialog components with html elements can short circuit proper flow of material ui component.
what i had... footer buttons failed to fix to the bottom... notice the body message is in a html div and the footer is in a material ui dialogactions
<dialog>
<div>body message</div>
<dialogactions>
<button>cancel</button> <button>save</button>
</dialogactions>
</dialog>
i fixed it by inserting the body-message div into the material ui dialogcontent component... this made the dialogactions do what it was supposed to do (stay fixed at the bottom).
<dialog>
<dialogcontent>
<div>body message</div>
</dialogcontent>
<dialogactions>
<button>cancel</button> <button>save</button>
</dialogactions>
</dialog>
Source: stackoverflow.com
Related Query
- Fix buttons at the bottom of Material-UI dialog
- Material UI: Display the dialog at the bottom left of the page
- How to submit the form by Material UI Dialog using ReactJS
- Dispatch a Redux action with the subsequent action as payload to show a snackbar or dialog of Material UI
- Align Card Buttons on bottom Material UI
- How do you position Material UI Popper in the bottom right corner of the browser?
- How to fix the error 'alpha' is not exported from '@material-ui/core/styles' when using Skeleton in Material UI
- How do I prevent Material UI Dialog from being dismissed upon clicking the backdrop?
- How to fix placeholder text within the input in material ui text field
- Get table pagination buttons and rows per page to the left on Material UI
- Make Item go the bottom using Flexbox and Material UI
- How to fix footer at the bottom of a component in react?
- How to Align Item at the bottom of the screen In material ui
- How do I set the text color of primary raised buttons for React Material UI?
- How to align buttons at the right bottom of panel
- What is the proper way of loading a material UI dialog per item in list, on click of an action, in a dynamic way?
- How to make material ui dialog show in the first half of screen height?
- material ui autocomplete in dialog placeholder fix delay
- Change the border bottom color of material ui textfield
- How to stop the buttons overflowing in material ui table row while scrolling?
- How to fix component position start on bottom then move to normal in react js when the page is refreshed
- how to fix an element in bottom while the keyboard is open
- How to conditionally render a Material UI dialog with the fade in/out animations
- How to make Radio buttons of the same Radio group align in several columns in Material UI?
- Material UI Dialog with checkbox acknowledgement before user can press the yes button to delete record
- Pivotting a material UI dialog in the center of the screen when it's height may vary
- How can I fix the positioning of this AccordionDetails using Material UI/Grid
- How to get buttons to the end of material ui list and checkbox to the start of the list?
- How can I create a button to a dialog box inside the PopperComponent of Material UI Labs Autocomplete
- How can I change the buttons displayed based on theme in Material UI?
More Query from same tag
- Using window.require('electron') in a render function causes the whole screen to go blank. Electron, React, Material UI
- Display html markup in react jsx
- Passing Parameter from Child to Parent trough Input React
- Trying to change a square's visibility with props
- Is it Anti-Pattern or less performant to split render functions in a Component?
- OnPress not working inside Touchable Opacity
- Styled components onClick rotate element
- React + Redux share actions between modules/domains
- How can I present a native UIViewController in React Native? (Can't use just a UIView)
- how to get a specific data from antd table
- React useState not updating because of useRef
- moment locale when you using fromNow()
- Is it possible to detect low power mode using JavaScript?
- How to properly type the theme passed as prop to the styled() method on Material UI? (TypeScript)
- React router v4 route onchange event
- react-mic record audio and send the blob as mp3/wav to backend
- Updated state not useful in the return statement of a method
- Need to show page header and an image side by side
- How do I render a nested object's property inside an array inside another array in MuiDatatables?
- How to increment a React state every second using setInterval?
- What does the myObj.param?.otherParam operator do and how is it used?
- How to delete populated id from mongoDB
- How to skip the rendering of an element of a React functional component when loading?
- React - change n dimension array object value
- react-select, cannot change color of text in placeholder within text box
- Download canvas as image not working in firefox and microsoft edge
- Uncaught TypeError: Cannot destructure property 'name' of 'response.profileObj' as it is undefined
- Show/Hide a component in React using state
- Unable to render out array in React using Array.map
- setState callback is not firing after state change