How many columns will a div defined as <div class="col-sm-2 col-lg-4"> be in a lg viewport?

In Bootstrap's grid system, the classes used to define column widths are based on a 12-column layout. When a div is defined with multiple classes, such as col-sm-2 col-lg-4, it allows you to control how that div behaves in different viewport sizes.

In this case, for a large viewport, the class col-lg-4 is applicable. This class indicates that the div will take up 4 columns out of the 12 available in the Bootstrap grid when the viewport meets the large breakpoint criteria. Since Bootstrap uses a 12-column grid structure, dividing the total number of columns (12) by the number of columns the div occupies (4) allows for 3 of these divs to fit within a single row.

The col-sm-2 class is relevant for small viewports, but since we're concerned with how many columns the div occupies specifically in a large viewport, we focus on col-lg-4. Thus, the correct answer is that the div will occupy 4 columns when viewed on a large screen.