arvindikchari
New Member
i'm trying to create responsive design webpage. it works well with my table and text (when i resize my browser, it resize automatically. but this does not happen to my picture. css file\[code\]@media screen and (max-width: 999px) {.page { width: 720px;}.header{ width:720px;}img{ width: 720px;}}@media screen and (max-width: 719px) {.page { width: 100%;}.header{ width:100%;}img{ width: 100%;}}@media screen and (max-width: 479px) {.page { width: 98%;}.header{ width: 98%;}}.page{ width: 960px; background-color: #fff; margin: 20px auto 0px auto; border: 1px solid #496077;}img{ float: left;width: 48%;margin-left: 1%;margin-right: 1%;}\[/code\]my aspx file\[code\]<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"></asp:Content><asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <h2> Welcome to ASP.NET! </h2> <p> To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>. </p> <p> You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&clcid=0x409" title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>. </p> <table border = "1"><tr><td><center>'''Learning Outcome'''</center></td><td><center>'''Achievement Methods'''</center></td></tr><tr><td>Realistic problem solving and learning to learn skills</td><td>my text here</td> </tr><tr><td>Managing a real-time project from initiation to rollout </td><td>my text here</td></tr><tr><td>Understanding banking industry processes & practices</td><td>my text here</td></tr><tr><td>Team Cohesiveness</td><td>*my text here</td></tr></table><div"> <img src="http://files.g4tv.com/images/blog/2008/06/18/633493967095957891.jpg" class="img" alt="DOMO" /> <img src="http://files.g4tv.com/images/blog/2008/06/18/633493967095957891.jpg" class="img" alt="image"></div>\[/code\]all my text are responsive but when my pictures is not.
jsFiddle
thank you!
jsFiddle
thank you!