Question: I'm trying to position the two buttons next to each other in the center of the page and also make the buttons static as you resize the page.

```
<!doctype html>
<html lang="en">

<head>
<style>
#button1{
width: 300px;
height: 40px;

}
#button2{
width: 300px;
height: 40px;
}
</style>

<meta charset="utf-8">
<meta name="Homepage" content="Starting page for the survey website ">

 <title> Survey HomePage</title>
</head>
<body>

<img src="kingstonunilogo.jpg" alt="uni logo" style="width:180px;height:160px">
 <button type="button home-button" id="button1" >Home</button>
 <button type="button contact-button" id="button2">Contact Us</button>
</body>
 </html>

```

Answer: 
you can add this style to your buttons:  

```
#button1 , #button2 {
display:inline-block;
/* additional code */
}

```

this aligns your buttons inline. ('side by side') :)
Have both the buttons inside a div as shown below and add the given CSS for that div

```css
#button1, #button2{
width: 200px;
height: 40px;
}

#butn{
    margin: 0 auto;
    display: block;
}
```

```html
<div id="butn">
 <button type="button home-button" id="button1" >Home</button>
 <button type="button contact-button" id="button2">Contact Us</button>
<div>
```