Hi all, ive created a site for a friend of mines company, relatively quick and easy site layout, however when it comes to mobile devices and in some cases desktops the site just looks an utter mess in regards to text and responsive layout and i cant for the life in me fathom out where im going wrong. ideally id like to make it non responsive and not have to go through every layour option for each device and change the full site… the actual site is live now @
ive tried adding some custom code to make the site non responsive (which is actually preferable for this site and purpose)
i used this code
<style>
@media screen and (max-width: 991px) {
.w-container {
max-width: none !important;
width: 940px !important;
}
}
@media screen and (max-width: 767px) {
.w-col { float: left; }
.w-col-1 { width:8.333333333333332% }
.w-col-2 { width:16.666666666666664% }
.w-col-3 { width:25% }
.w-col-4 { width:33.33333333333333% }
.w-col-5 { width:41.66666666666667% }
.w-col-6 { width:50% }
.w-col-7 { width:58.333333333333336% }
.w-col-8 { width:66.66666666666666% }
.w-col-9 { width:75% }
.w-col-10 { width:83.33333333333334% }
.w-col-11 { width:91.66666666666666% }
.w-col-12 { width:100% }
}
</style>
<meta name="viewport" content="initial-scale=1">
heres the link to the webflow site, if anyone could help that would be amazing as im under some pressure to get it wrapped up.
https://webflow.com/design/raised-access-flooring-supplies?preview=d664fea43fdc7a1b9f65af72c7eddff3
Many Thanks
James