Bootstrap (twbs:bootstrap)

If we have installed twbs:bootstap, do we still need to add Bootstrap codes into our html to make it work?

For example, do we still need to add the viewport meta tag

to ?

On my desktop, the ‘mobile screen’ for my web app appears correct.

But when it is viewed on an actual mobile device, the fonts and objects for the web app was too small.

Yes, you’re correct that you need to include the viewport meta in your template.

Otherwise you get whakcy issues like you said, even with the package included :slight_smile:

<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0, minimum-scale=1, maximum-scale=1">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">

Thanks! This works.

How do you make a drop-down menu (when web app is in mobile mode) go away after you click on one of the navigation items? Right now, I have to click on the hamburger icon ( again…

Using an example from W3…

In a mobile setting, how can we automatically collapse the Navbar once we click on Page 3?

You can make a function to hide/show the hamburger menu on click.

That whole menu is controlled simply by css. So you can use jquery to $("#menu").click(); to simulate the effect of it pressing.

So create an event, and run that code, your menu will go away :slight_smile:

Would you be able to elaborate on how the code might look like if we just want the effect for ‘Page 3’ per the W3 example above?

Just put a script on that specific page

1 Like