The problem with your example is the CSS application priority.
Explaining:
There are priorities for applying style rules in the CSS, they are the following, from highest to lowest priority:
- Rules with
!important
;
- Rules within the attribute
style
of a single element HTML
;
- Rules with one or more selectors per
id
;
- Rules with one or more selectors per
class
, atributo
or pseudo-seletor
;
- Rules with one or more selectors per element;
- Rules with universal selector.
These 6 priorities are applied when the rules are in the same file. If two rules of the same priority conflict, the one with the highest number of selectors in the highest priority wins.
When it comes to different files, file priorities are as follows, from highest to lowest priority:
Obs: Starting from item 2, refers to different files to the HTML page itself.
- Rules within the element
style
in the head
of HTML;
- Rules within a file imported by a
@import
within the style
;
- Rules inside a file imported by an element
link
;
- Rules within a file imported by a
@import
inside a file imported by an element link
;
- Rules within a file attached by an end user;
Obs: If the rules are with !important
they have the highest priority.
- Standard CSS rules of browser.
Source = Book "Pro CSS and HTML Design Patterns" by Michael Bowers.
I am mentioning CSS as feminine because of the translation of Creative StyleSheets
which means Cascade Style Sheets.
Getting right to the problem
How you define something within the attribute style
element, it overrides the width attribute of any class of the Bootstrap
, unless the width
for Bootstrap
has the !important
together, something I don’t believe occurs.
A suggestion to solve the problem would be to change the measure of width
for %
. Ai it maintains self-adjusting ability.
With
!important
doesn’t work?– Renan Gomes
Have you tried rewriting col-lg-6 for example, but only by changing % of width? ex:
.col-lg-6 {width: 100% !important;}
Remembering that col-lg-6 is only a part of the bootstrap responsiveness set. Examples: http://getbootstrap.com/examples/grid/ Explanations: http://stackoverflow.com/questions/19865158/what-is-the-difference-among-col-lg-colmd-andcol-sm-in-twitter-bootstra– Rafael Withoeft