Merhaba aşağıdaki kodlardaki butonları, 1 ve 2 numaralı ile 3 ve 4 numaralı butonları yan yana nasıl koyabiliriz?
<body style="text-align: center">
<p> </p>
<p> </p>
<p> </p>
<style>
.button {
text-align: center;
transition-duration: 0.9s;
cursor: pointer;
border-radius: 12px 12px 12px 12px;
}
.button1 {
background-color: red;
}
.button1:hover {
background-color: blue;
transform: translateY(-10px);
}
.button2 {
background-color: blue;
}
.button2:hover {
background-color: red;
transform: translateY(-10px);
}
</style>
<form action="
https://www.1google.com/" method="get" target="_blank">
<p align="center"><button class="button button1" style="width: 50px; height: 50px"><b><font face="Times New Roman" style="font-size: 30px" color="#FFFFFF">1</font></b></button>
</p>
</form>
<p align="center">
</p>
<form action="
https://www.2google.com/" method="get" target="_blank">
<p align="center"><button class="button button1" style="width: 50px; height: 50px"><b><font face="Times New Roman" style="font-size: 30px" color="#FFFFFF">2</font></b></button>
</p>
</form>
<p align="center">
</p>
<form action="
https://www.3google.com/" method="get" target="_blank">
<p align="center"><button class="button button2" style="width: 50px; height: 50px"><b><font face="Times New Roman" style="font-size: 30px" color="#FFFFFF">3</font></b></button>
</p>
</form>
<p align="center">
</p>
<form action="
https://www.4google.com/" method="get" target="_blank">
<p align="center"><button class="button button2" style="width: 50px; height: 50px"><b><font face="Times New Roman" style="font-size: 30px" color="#FFFFFF">4</font></b></button>
</p>
</form>
<p align="center"> </p>
<p align="center"> </p>
.
