Container Absolute

Overview

Container Absolute is a software package containing all the necessary elements to run in any environment. Container Absolute Component is used to contain the content inside of it. Having received support from Container, we can develop our website responsively.

Please refer to this for more information: https://mui.com/material-ui/react-container/.

Import

CODE

import { Box } from '@mui/material';

The above source will be imported automatically after dragging and dropping the Basic Component to the UI Preview Panel.

Property

Property:

Name	Default	Description
Id-name	Placeholder: <id-name>	The Id-name of the created component.
Margin and Padding	Size Unit: Px	The component Margin and Padding with many selectable Size Units.
Size	Size Unit: Px	The component Size includes Width and Height with many selectable Size Units.
Layout	Position: None Size Unit: Px	The component Layout includes Position and Top - Right - Bottom - Left with many selectable Size Units.
General	Visibility: none Opacity: 100%	The component General includes Opacity and Background.
Advanced Style		The component Advanced Style includes Classname and Inline Style addition.

Code Sample:

CODE

<Box
      sx={{
            'backgroundColor': '#ff6767ff',
            'bottom': '50px',
            'height': '100px',
            'left': '100px',
            'margin': '50px 100px 50px 50px',
            'opacity': 0.13,
            'padding': '100px 100px 50px',
            'position': 'absolute',
            'right': '50px',
            'top': '50px',
            'width': '100%',}}
          data-gjs-type="ContainerAbsolute">
    </Box>