HTML Buton yapılandırması

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>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</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">&nbsp;
</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">&nbsp;
</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">&nbsp;
</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>
&nbsp;<p align="center">&nbsp;</p>
<p align="center">&nbsp;</p>
 
Teşekkürler arkadaşlar artık e-ticaret sitem var ihtiyacım kalmadı :)
 

Yeni konular

Geri
Yukarı