Jump to content
Sign in to follow this  
Krzysiek-

Rozmieszczenie tekstu i inputów (przycisków) w odpowiednich miejscach z marginem

Recommended Posts

Elo, mianowicie mam taki problem, że wszystko mi się miesza w divie ;/ Nie chce się ustawić tak jak ja bym to chciał czyli tekst po lewej z margin 5px a inputy po prawej tez z margin 5px oraz 1px odstępu pomiędzy nimi.

Tutaj kod html od tej części:

<div id="statystyki">
<b>Statystyki</b></br>
        <div id="label">Zdrowie</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
                <div id="label">Mana</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
                <div id="label">Kondycja</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
                <div id="label">Siła</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
                <div id="label">Zręczność</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
                <div id="label">Moc</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
                <div id="label">Wiedza</div><div class="col-xs-3">
          <div class="form-group">
            <input type="text" value="20" placeholder="Inactive" class="form-control" />
          </div>
        </div>
        
        </div>

 

A tutaj css(css od inputów jest z tego tematu) 

 

#statystyki {
    padding-top: 10px;
    float:left; 
    background-color: #2E2E2E;
    border-bottom: 3px solid #FF7F00;
    height: 300px;
    width: 20%;
    margin-left: 20px;
    border-radius: 2px;
}
#label {
    float: left;
    margin-left: 5px;
}
.select2-search input[type="text"] {
  border: 2px solid #bdc3c7;
  color: #34495e;
  font-family: "Lato", Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.467;
  padding: 8px 12px;
  height: 15px;
  width: 50px;
  float: right;
  margin-right: 5px;
  border-radius: 6px;
  box-shadow: none;
  -webkit-transition: border 0.25s linear, color 0.25s linear, background-color 0.25s linear;
          transition: border 0.25s linear, color 0.25s linear, background-color 0.25s linear;
}

 

A tutaj ss jak to aktualnie wygląda:

image

Edited by Rysiek

Share this post


Link to post

Czemu używasz:

<b><br />

A gdzie masz zdefiniowane form-group?

 

Jakbym był na kompie to bym Ci dał gotowy ale mam antybiotyk i się nie ruszam

Edited by pBartnik

Share this post


Link to post

Popatrzyłem tylko oględnie na kod i widzę, że nie ma sensu go poprawiać. Jak już używasz Bootstrapa, to wystarczy odwiedzić stronę gdzie jest dokumentacja i sypią tam przykładami z formularzami (Bootstrap - Formularze). CSS już sobie sam praktycznie napisałeś (skopiowałeś), więc jak się nie do końca na tym znasz, a chcesz sam coś tworzyć, to proponuję zacząć od podstaw, a nie wchodzić w frameworki nie znając HTML/CSS.

  • Like 1

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Create a New Account. It’s free and easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
×
×
  • Create New...