Freesnöw
Freesnöw

Reputation: 32143

Forcing an image to a specific spot

I have an image that I need to place to the right of content on the left. I've determined, to do this, it will require that I absolutely place the object. I also need the image to stay its same size IF the size is smaller than the image tags defined size, if not, the image needs to scale itself down to fit within the borders. Is this all possible?

Thanks if you can!

I'm using HTML, CSS, and JavaScript (ONLY IF REQUIRED PLEASE!)

Here is some code to look at :)

function createQuestions(id) {
    var tReturn="<form style=\"text-align: left;width: 33.33333%;background-color: lightblue;border=1px solid #000000;padding: 10px\">";
    tReturn=tReturn+"<b>Questions "+(id+1)+":</b><br />&nbsp;&nbsp;&nbsp;&nbsp;<i>"+Questions[id].Question+"</i><br /><br />";
    for (var i=0,l=Questions[id].Values.length;i<l;i++) {
        tReturn=tReturn+"<input onClick=\"checkAnswer("+id+","+i+",this)\" type=\"button\" value=\""+Letters[i]+"\" style=\"width:50px\" />. "+Questions[id].Values[i]+"<br />";
    }
    //V----- THIS LINE BELOW!
    //tReturn=tReturn+"<img src='images/test.jpg' style=' />"
    tReturn=tReturn+"</form>";
    return tReturn;
}

Upvotes: 0

Views: 260

Answers (1)

Thomas Shields
Thomas Shields

Reputation: 8942

Try using max-width and max-height to solve that second problems - so if you want an image that's no bigger than 400px wide but otherwise sizes to fit itself, do:

<img src="../blah/img.jpg" style="max-width:400px" />

For aligning it to the right, try the float:right style or applying text-align:right on it's parent container, or position:absolute; right:0px

Upvotes: 1

Related Questions