Abdullah_23

Hello! To address the issue of image titles wrapping mid-word on the mobile version of your site without reducing the text size, you can consider using CSS media queries and the overflow-wrap property. The default styles for your image titles are set, including the desired font size. The overflow-wrap: break-word; property is used to allow word wrapping under normal circumstances. Inside a media query for screens with a maximum width of 600 pixels (you can adjust this value based on your needs for mobile responsiveness), the font-size is set to auto, which lets the browser adjust the font size based on available space. white-space: nowrap; prevents the text from wrapping, and overflow: hidden; hides any overflow content that doesn't fit within the designated space. This way, on mobile devices, the font size can be adjusted automatically, and the titles won't break mid-word, while on larger screens, the specified font size is maintained. Adjust the values as needed to suit your design preferences.