# I couldnt get work css applied in button exercise course react 18 begeiner

**URL:** <https://forum.codewithmosh.com/t/i-couldnt-get-work-css-applied-in-button-exercise-course-react-18-begeiner/25162>\
**Category:** React\
**Created:** [February 17, 2024, 3:51pm UTC](https://forum.codewithmosh.com/t/i-couldnt-get-work-css-applied-in-button-exercise-course-react-18-begeiner/25162 "2024-02-17T15:51:01Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![hafiz903](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@hafiz903](https://forum.codewithmosh.com/u/hafiz903)\
**Post date:** [February 17, 2024, 3:51pm UTC](https://forum.codewithmosh.com/t/i-couldnt-get-work-css-applied-in-button-exercise-course-react-18-begeiner/25162/1 "2024-02-17T15:51:01Z")

</div>

![4](https://us1.discourse-cdn.com/flex020/uploads/codewithmosh/original/2X/f/f0fb28c722b9abb50ffa972c3271fc17d0138ed6.png)

buton,tsx

import styles from “./Button.module.css”  
interface Props{

```
children: string;
color?: 'primary'|'secondary'|'danger';

```

onClick: () =\> void;  
}

const Button =({children,onClick,color= ‘primary’}:Props) =\>  
{

return(

```
<button className={[styles.btn,styles['btn-' + color]].join ('')}onClick={onClick}>{children}</button>

```

)

}

export default Button

button.module.css

.btn{  
padding: 10px;  
border-radius: 8px;  
border: 0;  
padding-right: 1000;

}  
.btn-primary{  
background-color: #05387a;  
color: white;

}

app.tsx

//import Alert from “./Components/Alert”;  
import ListGroup from “./Components/ListGroup/”;  
import Button from “./Components/Button”;  
import “./App.css”;  
function App() {  
// let items =  
//[

//‘Pakistan’,  
//‘London’,  
//‘Pakistan’,  
//‘London’,  
//‘Pakistan’,  
// ‘London’,

//];  
//const handleSelectItem= (item:string) =\>{  
[//console.log](https://console.log)(item);

//}  
//return (

  
//
  
//);

return (  
//

  
// Helloworld

```
<button onClick={() => console.log("clicked")}>My Button</button>

```

);  
//return(

//

  
// Helloworld
  
//);  
}  
export default App;
