Topic: Margin and padding problems
Belovol pro asked 6 years ago
- I take code from here.
- I make to files
- Ev_han.js with code:
-
import React from "react";//import { render } from "react-dom"; //import {Container} from 'mdbreact' //import { Button, Card, CardBody, CardImage, CardTitle, CardText, CardGroup } from 'mdbreact'; //import {Row, Col} from 'mdbreact' //import {View, Mask, Animation, Fa} from 'mdbreact' const EventHandler=(props) => ( <div className="container"> <div className="row"> <div className="col green"> One of three columns </div> <div className="col green"> One of three columns </div> <div className="col green"> One of three columns </div> </div> </div> ) export default EventHandler
- index.js with code:
import 'font-awesome/css/font-awesome.min.css'; import 'bootstrap-css-only/css/bootstrap.min.css'; import 'mdbreact/dist/css/mdb.css'; import React from 'react'; import ReactDOM from 'react-dom'; import { BrowserRouter as Router } from 'react-router-dom'; //import registerServiceWorker from "./registerServiceWorker" //import AppPage from './AppPage'; //import App from './Parall_1'; //import App from './App' //import NavbarFeatures from './Navigation' //import App from './Paginator'; //import BasicExample from "./Router_ex" //import App_1 from "./TestProps" //import Main from "./Main" //import MdbPro from "./MdbPro" //import EventHandler from "./Event" import EventHandler from "./Ev_han" //registerServiceWorker(); ReactDOM.render( <div> {/* <Router> <Main/> </Router> */} <EventHandler/> </div> , document.getElementById("app"));
- Then I get no any padding and margin, though in your example they are. Why?
Anna Morawska staff answered 6 years ago
Mitch P free commented 6 years ago
Can't you edit the relevant CSS file instead of inline styling? Or at least, add custom CSS into a custom.css to override any default css like padding, margin, etc.,?Anna Morawska staff commented 6 years ago
Hi, yes, of course, you can, it is for demonstration purposes onlyBelovol pro answered 6 years ago
Anna Morawska staff answered 6 years ago
<div className="col green" style={{border:"2px solid #fff"}}> One of three columns </div>
Closed
This topic is closed.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Closed
- ForumUser: Pro
- Premium support: No
- Technology: MDB React
- MDB Version: 4.7.1
- Device: 4xIntel Core i7-4510U CPU @2 GHz
- Browser: Google Chrome V- 68.0.3440.8
- OS: openSUSE Leap 42.3
- Provided sample code: No
- Provided link: Yes