custom css breaks with bootstrap grids -


My custom vertical-side navigation bar works fine myself Here's a plnkr:

However, when presented within a bootstrap grid, the same navbar is broken. Here Plnkr: 

  & lt; Div class = "container" & gt; & Lt; Div class = "row" & gt; & Lt; Div class = "col-lg-1 col-md-1" & gt; & Lt; Ng- included src = "'nav.html" "& gt; & Lt; / Ng-include & gt; & Lt; / Div & gt; & Lt; Div class = "col-lg-11 col-md-11" & gt; This content section is & lt; / Div & gt; & Lt; / Div & gt;

I can decide on using some things like adding a minimum-height property to a class

. Current-side-bar

However, I do not believe that this is the right way to do it. I have some concept here

Does anyone please tell what is wrong?

Plunk that you have not called the nav.css file. 

  & lt; Link rel = "stylesheet" href = "nav.css" />

Now all that is missing is the background color and so it should not be difficult to add it back. Your layout is working basically, however It needs to fill the width of the container instead of the fixed width (I said in my strength).

But keep in mind that you can not get a fixed width, in Columns Bootstrap 3 you are expecting. A column will always be 1/12 of the width of the screen. Also, you should start with the set column for the Xs and then specify the SM, MD, or LG if they should be different. For example, you may need a 3 x column to fit your content (col-xs -3), but only 1 (col-lg-1) in a large device


Comments

Post a Comment

Popular posts from this blog

python - Overriding the save method in Django ModelForm -

I'm having trouble overriding a ModelForm save method. I get this error I'm: Exception type: TypeErier Exception Value: Save () found an unexpected keyword argument 'committed' My intentions include a form 3 fields Submit several values ​​for, then create an object for each combination of those areas, and to save each object file models.py class collarsult type (models.Model): id = model. AutoField (db_column = 'icontact_result_code_type_id', primary_key = true) callResult = models.ForeignKey ( 'CallResult', db_column = 'icontact_result_code_id') campaign = models.ForeignKey ( 'campaign', db_column = 'icampaign_id') CALLTYPE = models.ForeignKey ( 'CALLTYPE', db_column = 'icall_type_id') agent = models.BooleanField (db_column = 'bagent', default = true) teamLeader = models.BooleanField (db_column = 'bTeamLeader', default = true) active = models.BooleanField (db_column = Django.form...
Read more

html - CSS autoheight, but fit content to height of div -

I have a div in which there are three children- div in the left and middle div: float: left while true: float: true because it is my layout Actually will spoil, I've used ClearFix Hack: .cf {zoom: 1; }. Cf: First,. Cf: {content: ""; Display: Table; }. Cf: After {clear: both; } It still works, but I want to be the right div an indicator. So it should fill 100% of the parent unit of height. How can I complete this? PS is the full code: & Lt; / Div & gt; & Lt; Div class = "mobile_content" & gt; & Lt; H5 & gt; {{Data.titel}} & lt; / H5> & Lt; Table & gt; & Lt; TR & gt; & Lt; Th & gt; Komponist: & lt; / Th & gt; & Lt; TD & gt; {{Data.komponist}} & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Th & gt; Instrument: & lt; / Th & gt; & Lt; TD & gt; {{Data.instrumente}} & lt; / TD & gt; & Lt; / TR & gt;...
Read more

qt - How to prevent QAudioInput from automatically boosting the master volume to 100%? -

I have been trying to use Qt5 multimedia to record audio with QAudioInput, however, when I see If QAudioInput is started, it increases the master volume of my sound device to 100%. How can I prevent QAudioInput from changing the master volume? My current development platform is Linux with PalsAdio (with flat audio disabled). How can I use QAudioInput : QAudioDeviceInfo device_info = QAudioDeviceInfo :: defaultInputDevice (); QAudio format format; Format.setSampleRate (44100); Format.setChannelCount (1); Format.setSampleSize (16); Format.setCodec ("Audio / PCM"); Format.setSampleType (QAudioFormat :: SignedInt); Format.setByteOrder (QAudioFormat :: LittleEndian); Std :: cout & lt; & Lt; Device_info.deviceName (). ToUtf8 (). ConstData () & lt; & Lt; Std :: endl; QAudioInput * default_device = new QAudioInput (device_info, format); QIODevice * default_io_device = default_device-> Start (); a QAudioInput.setVolume () method is not you I ...
Read more