View original (French)

Position an image in an html page

Solved
Cbast7 -  
Hello,

I would like to place an image on an HTML page, meaning I want to position it where I want, in my case next to some text and not at the bottom of the page. How can I do this, please?
Configuration: Windows XP Firefox 3.0.11

2 answers

  1.  monkey_monk
    Here is an example of what you are asking for:

    [HTML] 
    <img class="left" src="image.jpg" width="225" height="150" alt="" title="" /> <h2>A subtitle.</h2> <p>A paragraph.</p>


    [CSS] 

    .left { float:left; margin:0 10px 0 20px; } // margin = top,right,bottom,left


    Note, to make it simpler you can do: 

    <img class="left" src="image.jpg" width="225" height="150" alt="" title="" style="float:left;margin:0 10px 0 20px;" />


    Have a nice day.

    70
    1. Cbast7 Author
      <link rel="stylesheet" href="style.css" />
      1
    2. monkey_monk 
      <link rel="stylesheet" type="text/css" media="all" href="style.css" />


      to be placed between <head> and </head>.

      --
      [Monkey Monk]
      1
    3. monkey_monk 


      <img class="left" src="image.jpg" width="225" height="150" alt="" title="" style="float:left;margin:0 10px 0 20px;" />


      --
      [Monkey Monk]
      17
    4. Cbast7 Author
      Yes, I prefer working with CSS; it will teach me more, but if I see that I'm struggling a bit, of course, I'll go with that code =)
      3
    5. monkey_monk
      The last code I gave you is indeed not "very pretty"... it's better to work by separating the elements.

      Have fun then! ;)

      --
      [Monkey Monk]
      1