creating templates in angular 2 application

Question

I am trying to implement a simple application in angular 2 .

i designed my home page with a top nav bar and side nav bar.

Below shown is the code for my home page template

home.component.html

<div class="well sidebar-nav">
    <ul class="nav nav-list">
        <li class="nav-header">Status At A Glance</li>
        <li class="active"><a href="#">Remaining</a></li>
        <li><a href="#">In Progress</a></li>
        <li><a href="#">Accepted</a></li>
     </ul>
</div>  

<p> <strong> Welcome to eSpace Home </strong></p>
<img src="/../../assets/i9.jpeg" class="img-rounded" alt="home" height="200" width="600">

Below shown is the screen shot of my home page

As shown in the above image i am unable to reduce the width of my side nav and my content i.e "welcome to espace home" and image is being aligned below my side nav.

can any body please help me fix this by guiding me how can i reduce the width of my side nav and how can i align my content right side of my side nav bar.

v4-alpha.getbootstrap.com/getting-started/introduction

Gautam
– Gautam

2017-12-21 09:49:24 +00:00
Commented Dec 21, 2017 at 9:49 — Gautam
– Gautam, Commented Dec 21, 2017 at 9:49
ok i will refer this .. but please can you help me out here

Heena
– Heena

2017-12-21 09:51:34 +00:00
Commented Dec 21, 2017 at 9:51 — Heena
– Heena, Commented Dec 21, 2017 at 9:51

Quan Vo · Accepted Answer · 2017-12-21 09:55:22Z

1

You may need grid system. For example:

<div class="row">
   <div class="col-lg-4">
      Your nav bar
   </div>
   <div class="col-lg-8">
      Your content
   </div>
</div>

answered Dec 21, 2017 at 9:55

Quan Vo

1,35611 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

creating templates in angular 2 application

Below shown is the code for my home page template

home.component.html

Below shown is the screen shot of my home page

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

Below shown is the code for my home page template

home.component.html

Below shown is the screen shot of my home page

1 Answer 1

Comments

Related