html - having difficulty with responsive web design -


i image larger size on computer, fit smaller devices. when try have larger image size computer, increase size on phone, , shrinks , pushes navigation (which supposed in middle) left. (my navigation meant on left hand side on computer, in middle horizontally on smaller devices) how can set different image sizes different devices? tried @media doesn't seem working. i'm beginner, see i'm doing wrong?

areas experience issue on .typecontainer, .type, .type1

link screenshots: http://imgur.com/bm5xdwr,p9eux4v,mq3gpp1#0

html:

<!doctype html>  <html> <head>     <title>example</title>     <link rel=”stylesheet” type=”text/css” href=”style.css” />     <meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0”> </head>  <body>  <div id=”topnav”> <nav class=”navigation” role=”navigation”> <ul>     <li class=”work”>         <a href=”work.html”>work</a>     </li>     <li class=”about”>         <a href=”about.html”>about</a>     </li>     <li class=”contact”>         <a href=”contact.html”>contact</a>     </li>     </ul> </div>  <div class=”typecontainer”>     <img class=”type” src=”image.jpg”>     <img class=”type1” src=”type1.jpg”> </div>  </body> </html>

css:

#topnav{     display:block;     margin-left: 50px; }  ul{     padding:0; }  ul li {     list-style-type: none!important;     font-family: 'pt sans', arial, sans-serif;     display: block;     margin-top: 6%;     padding: 0 5px;     font-size:25px;     font-style: normal;     font-weight: 100;     line-height: 1%;     float:left;     margin-left: 18px;     letter-spacing: -1px;   /* iphone */ @media screen , (min-device-width : 320px) , (max-device-width : 480px) {     .iphonecontainer .iphone .typecontainer .type .type1     { max-width: 100%; } }  /* ipad */ @media screen , (min-device-width : 768px) , (max-device-width :  1024px) {     .iphonecontainer .iphone .typecontainer .type .type1     { max-width: 100%; } }  /* iphone */ @media (max-width : 480px) , (min-width : 320px) {     #topnav{         margin: 0 auto;         width: 320px;     }     ul{         padding:15px;     } }  /* ipad */ @media screen , (min-device-width : 768px) , (max-device-width : 1024px) {     #topnav{         margin: 0 auto;         width: 320px;     }     ul{         padding:15px;     } }  /* iphone */ @media (max-width : 480px) , (min-width : 320px) {     #work_links{         margin: 8%;         width: 320px;     } }  .typecontainer { width:100%; float:left; margin-top:6.5%; }  .type {  display:block;  max-width: 500px;  margin: 0px auto;  padding: 0;  }   .type1 {  display:block;  max-width: 500px;  margin: 0px auto;  padding: 0;  }


-

Comments

Post a Comment

Popular posts from this blog

c# - Binding a comma separated list to a List<int> in asp.net web api -

the default binder in web api expecst http://url.com/webapi/report/?pageids=3243&pageids=2365 to bind public ihttpactionresult report(list<int> pageids){ // exciting webapi code} i wish bind http://url.com/webapi/report/?pageids=3243,2365 as running out of space in url get . i have created class public class commaseparatedmodelbinder : system.web.http.modelbinding.imodelbinder { public bool bindmodel(httpactioncontext actioncontext, modelbindingcontext bindingcontext) { //binding in here } } and registered in webapiconfig.cs var provider = new simplemodelbinderprovider( typeof(list<int>), new commaseparatedmodelbinder()); config.services.insert(typeof(modelbinderprovider), 0, provider); i have altered method signature use model binder so public ihttpactionresult report( [modelbinder] list<int> pageids){ // exciting webapi code} however break point in binder not being ...
Read more

how to prompt save As Box in Excel Interlop c# MVC 4 -

i want export excel sheet using excel interloop... i have datatable convert excel sheet... now there way save file using save dialogue box in mvc 4 here code public string datatabletoexcel(datatable dt, string htmlheading, string key) { try { microsoft.office.interop.excel.application excel; microsoft.office.interop.excel.workbook excelworkbook; microsoft.office.interop.excel.worksheet excelsheet; microsoft.office.interop.excel.range excelcellrange; excel = new microsoft.office.interop.excel.application(); excel.visible = false; excel.displayalerts = false; excelworkbook = excel.workbooks.add(type.missing); excelsheet = (microsoft.office.interop.excel.worksheet)excelworkbook.activesheet; excelsheet.name = "sheet1"; dataset ...
Read more

xslt 1.0 - How to access or retrieve mets content of an item from another item? -

my use case have item has link in item. example, item 123456789/152 has metadata field dc.relation.hasversion=123456789/717 . within item view of 123456789/152 , how can retrieve values of metadata of 123456789/717 ? example, want retrieve dc.language.iso value of 123456789/717 123456789/152 . i looked @ related items feature in dspace don't know how metadata displayed in related items list pulled items in list. i using dspace version 5.3 mirage 2 theme . edit based on schweerelos answer, below actual code. using custom metadata field dc.relation.languageversion . basically, want link other version instead of displaying value, display dc.language.iso of other version in item-view.xsl . i've incorporated answer of schweerelos question in code just displaying value of dc.relation.languageversion . sample values of dc.relation.languageversion 10665.1/9843 ; 10665.1/9844 ie not complete uri handle. thanks in advance! actual code <xsl:template name=...
Read more