diff --git a/cat photo app b/cat photo app new file mode 100644 index 000000000..7d4ddbbc1 --- /dev/null +++ b/cat photo app @@ -0,0 +1,104 @@ + + + + + + Cat Photo App + + + +
+

🐾 Cat Photo Gallery 🐾

+
+
+
+ +
+ Cute Cat 1 +

Cute Cat 1

+
+ +
+ Cute Cat 2 +

Cute Cat 2

+
+ +
+ Placeholder Cat 3 +

Placeholder Cat 3

+
+
+ Placeholder Cat 4 +

Placeholder Cat 4

+
+
+
+ + + + + + #CSS code +/* General Reset */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: Arial, sans-serif; + background-color: #f5f5f5; + color: #333; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +header { + background-color: #4CAF50; + color: white; + padding: 20px; + text-align: center; + width: 100%; +} + +main { + padding: 20px; + width: 100%; + max-width: 1200px; +} + +.gallery { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); + gap: 20px; +} + +.image-container { + overflow: hidden; + border-radius: 10px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); +} + +.image-container img { + width: 100%; + height: auto; + transition: transform 0.3s ease-in-out; +} + +.image-container img:hover { + transform: scale(1.1); +} + +footer { + margin-top: 20px; + text-align: center; + background-color: #333; + color: white; + padding: 10px 0; + width: 100%; +}