Responsive css not working

[simna]

The problem is that my website is working good on my laptop but when I switch to desktop and also surprisingly other laptops, the alignment is all disrupted. Here’s the link of the website: http://chitturcollege.ac.in/

I tried changing the responsive css. It works on the inspect element by right clicking and the alignment get fixed but when I actually correct the css and then preview, the changes are not brought in to the site. It remains the same as before.

Please help…

[Shikkediel]

There’s a problem with the image inside the header not being responsive:

<div class="grid_12">

  <div class="head_logo grid_12 ">
    <a href="http://chitturcollege.ac.in" class="alignleft">
      <img src="http://chitturcollege.ac.in/wp-content/uploads/2016/12/banner1-1.png" class="alignleft">
    </a>

Try this to start with:

[src*="banner1-1"] {
width: 100%;
}

It’ll look tiny on small screens and may need a media query to adapt to that but solves the misalignment…

Edit – most of it anyway, I also see an issue occurring on screens that would qualify as phone size.

[Author]

Posts