Controlling a display property in responsive design

Question

Good day, I have this question:

Say I have a div for a mobile displays:

<div id="wrapper">
  <img src="#"/>
</div>

And now for tablets I would like to destroy the "wrapper" div and safe the img. CSS for tablet displays:

#wrapper {display: none:}

This will destroy the wrapper but the img too, is there anyway to safe the img using just CSS and not Jquery ?

Thanks Renzo

I will try to show what is the real problem with the design of this site, is definitely more complicated than my simple question.

The design:

http://www.abejanegra.com/images/design_problem_a.jpg

What I need:

http://www.abejanegra.com/images/design_problem_b.jpg

I'm confused about this solution.

Answer 1

Read up on media queries. You can do amazing things.

Also, the world is a lot deeper than jquery. I love it, but check out asp.net and C#, or even php. Code behind is extremely powerful. You could do what you're trying to do very very easily.