1 Replies - 561 Views - Last Post: 16 July 2014 - 07:11 AM

#1 Now2407   User is offline

  • New D.I.C Head

Reputation: -2
  • View blog
  • Posts: 43
  • Joined: 18-April 14

help with bootstrap grid

Posted 13 July 2014 - 10:44 PM

i'm creating a website where people can click social icons. im using twitter bootstrap. i'm trying to position the social icons at the top but i don't know how to fix it?? could some one help?

Posted Image

heres my code

the html code:
<!doctype html>

<html lang="en">
    <title><!-- Insert your title here --></title>
    <link rel="stylesheet" type="text/css" href="home.css">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
    <div class="row">
        <div class="container">
            <ul class="center">
                <li >home</li>
            <div class="menu">
            <ul class="pull-right">
            <li><img src="images/fbook.png" height="30px"  width="30px"/></li>
            <li><img src="images/gplus.png"height="30px"  width="30px" /></li>
            <li><img src="images/twit.png" height="30px"  width="30px"/></li>
            <li><img src="images/instagram.png" height="30px"  width="30px"/></li>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

and the css:

    text-align: center;
     list-style: none;
.center li{
    display: inline-block;
    list-style: none;
    margin: 0px;
    padding: 0px;
.pull-right li{
   display: inline-block;

margin: 5px 5px 5px 5px;



    background-color: gray;

Is This A Good Question/Topic? 0
  • +

Replies To: help with bootstrap grid

#2 fatihmert   User is offline

  • D.I.C Head
  • member icon

Reputation: 1
  • View blog
  • Posts: 127
  • Joined: 04-March 12

Re: help with bootstrap grid

Posted 16 July 2014 - 07:11 AM

So, You weren't do just .container item.
You must create grid, You can examine its official document, here is link

Before, you will define grid system after apply pull-right/pull-left classes.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1