Resize the webpage for responsive web layout

Question

I have developed the site in bootstrap. when i'm trying to resize site in browser the text are not re-sizing properly. I have tried few things in bootstrap, nothing is working great in text level.

here my attempt to testing the site http://i.giphy.com/xT0BKp4niP44vGOjmM.gif

Please have a look and let me know if any suggestions to make the site looks great when we resize the browser windows as well as for tablet + mobile too.

Answer 1

You can use media querys for examle:

p {
    font-size:80px;
}

@media (max-width:800px) {
    /* here goes your text code , you need to change text size here for example */
    p {
        font-size:30px;
    }
}

• LOOK HERE for a Fiddle.
• LOOK HERE for a Fiddle for ALL SIZE OF SCEENS

See also this Fiddle.

p {
    font-size:30px;
    font-size:10vw;
}