Ad

Changing The Size Of An Image With Css

- 1 answer

Is it possible to change the size of image with css? I was thinking to use thumbnail but having problem...but then I thought to myself, is it possible to change the size of an image with css? For example

<style>
#a{
    .height:70px;
    .width:70px;

}

</style>

<div id = "a">
<img src="{{post.image}}" />
</div>

I tried it, and it doesn't work....anyone knows why?

Here, https://blog.openshift.com/day-16-goose-extractor-an-article-extractor-that-just-works/ they are using javascript or jquery to control the size of an image, how are they doing that? Can someone tell me how I can incorporate this with my <img src="{{post.image}}" />

<script type="text/javascript" src="static/js/jquery.js"></script>
<script type="text/javascript">
    $("#myform").on("submit", function(event){
        $("#result").empty();
        event.preventDefault();
        $('#loading').show();
        var url = $("#url").val()
        $.get('/api/v1/extract?url='+url,function(result){
            $('#loading').hide(); 
            $("#result").append("<h4>"+result.title+"</h4>");
            $("#result").append("<img src='"+result.image+"' height='300' width='300'</img>");
            $("#result").append("<p class='lead'>"+result.text+"</p>");
    })


    });

</script>
Ad

Answer

Kim, you may want to look at Resize image proportionally with CSS? it may help you figure out a solution.

Ad
source: stackoverflow.com
Ad