Positionnement en CSS

Bonjour à tous

Voila, je suis novice en la matière mais je voudrais créer un site avec un design un peu spéciale pour la première page:
Il s'agirait d'un cadre avec dedans 3 photos alignées mais espacées et mettre sur le dessus des images en .png qui gère l'opacité afin d'avoir un effet d'opacité sur des parties des photos.

Je ne sais pas aligné 3 images en CSS

J'ai essayé avec les div et une classe qui les positionne en position relative mais je me retrouve avec des top :-300px ; et il parait que certains navigateurs n’aiment pas les valeurs négatives.

J’ai aussi essayé style="dispaly:inline" afin d’afficher mes images de gauche à droite (toujours le même problème : elles sont affichées de haut en bas )


J’ai aussi essayé de mettre des span à la place des div, ce qui reviens à « 2 ».

Je ne vois vraiment pas comment faire.
Je ne vous donne pas mon code, il n’y a rien juste y trois images que je voudrais placer de gauche à droite avec un espacement
PS : Y a-t-il une différence à appliquer une class à une image plutôt qu’à un div ?

Merci d’avance à tous ceux qui liront ce message.