Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Twitter-Bootstrap - put simple elements inline

Tags:

Is there anyway to put 2 <a> elements displaying inline?

i tryed :

<div class="form-inline"> <a>jjj</a> <a>sss</a> </div> 

and also

 <div class="row-fluid">     <a class="inline">jjj</a>     <a class="inline">sss</a>     </div> 

but it doesn't work.

like image 750
itsme Avatar asked Mar 26 '13 10:03

itsme


People also ask

How do you inline a bootstrap element?

Use the d-inline-block class to create a inline-block element. Add breakpoints (sm, md, lg, xl, and xxl) to the classes (d-*-inline-block) to control when the element should be a inline-block element based on the screen width. Resize the browser window to see how it works.

Can DIVS be inline?

You should use <span> instead of <div> for correct way of inline. because div is a block level element, and your requirement is for inline-block level elements.

What is D block bootstrap?

d-block , . d-inline , or . d-inline-block to simply set an element's display property to block , inline , or inline-block (respectively). To make an element display: none , use our responsive utilities instead.


1 Answers

Anchor tags by default should be displayed inline. You must have some extra styling setting them to display as block elements or something similar.

Using your code, here is a working JSFiddle.

Inspect your page to find out where the anchor's display is being set and either modify that or set the element to display:inline after that. As you've already added class="inline" you can simply just add:

a { display:block; /* Pre-existing code */ } a.inline {     display:inline; } 

Also as a note I don't think row-fluid is designed to work without Bootstrap's other scaffolding elements, if you want a full-width row you should use:

<div class="row-fluid">     <div class="span12">         <a class="inline">jjj</a>         <a class="inline">sss</a>     </div> </div> 
like image 177
James Donnelly Avatar answered Sep 18 '22 09:09

James Donnelly