How to make design responsive all browser?

HTML & CSS
1

I have made a website but not a know how make a responsible ? why we make a page respaonsive

2

Welcome to the forums, @NikitaBhoite.

I suggest you read this article, which will provide a good overview for you. If you have any further questions about the subject, please ask. https://www.sitepoint.com/responsive-web-design/

3

Hi there NikitaBhoite,

If you code your site in HTML it will altermatically be responsive. :sunglasses:

It is the improper use of CSS which makes it otherwise. :scream:

Simply avoiding the use of fixed CSS values is the secret of
maintaining the status quo. :ok_hand:

coothead

3 Likes
4

Thank you coothead sir i tried my best to make best design

5

Also make sure this line of code goes in your head section

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
2 Likes
6

Test with all browser widths between 300px and 950px to make sure it displays correctly across that range. You may also want to test wider screens but you can simply center the content for everything wider than that.

7

I took web design in college including the advance web design course. In my personal opinion start off by learning Fluid Grid Layouts, it will save you a lot of headaches and you can even download already made grid layouts or even use bootstrap. Just google Fluid Grid Layouts and you find a whole lot of information and I even believe this website comes up on the search. :grinning:

8

In my contrary opinion, Grids complicate and restrict an otherwise free flowing creative process. How many users come here for help because they don’t know how to modify their grid or framework? They learn plugins but do not understand how the underlying code works so they can’t customize their layout.

I would advise anyone to get a very solid foundation in HTML and CSS and get some experience using it before anything else, even JS.

7 Likes
9

You should already have a solid foundation of HTML / CSS to begin with (or learn that first) before you even contemplate responsive design and using grids doesn’t mean it restricts the “creative” process (even if you don’t use them). Using grids or just understanding the fluidity of grids means you understand the foundation of fluid design the foundation of responsive design. Maybe I should had said to understand the grid concept (how to calculate the percentage or math behind it - it really isn’t that hard - once again you can Google it to find out to do it). Just making a simple grid by itself without actually using it makes it even easier to understand responsive design better (when the light bulb turns on) in my opinion than just being creative and shooting from the hip. It also helps when people learning responsive design have the html/css validated easier for they are writing proper syntax. Many times a person ask for help and doesn’t even comprehend that pixels are fixed and other thing that goes into responsive design.

I don’t use plugins or frameworks myself that even goes for backend programming that I also do and that was self-taught. Though now I kind had wish that I learn a framework along the way, for now I don’t want to go back (maybe hesitant is a better way to say it) to learn a framework for I know the concept I just don’t want to learn the syntax of the framework.

10

As long as you don’t apply any CSS that breaks the natural responsiveness of the HTML you should not have any problems.

1 Like
11

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.