Leahcim
Leahcim

Reputation: 42069

horizontal alignment with bootstrap.css (or regular css override)

I'm trying out Twitter's bootstrap.css, want to get the <h2> and the image to align horizontally, right now they're on top of each other. Here's a fiddle http://jsfiddle.net/mjmitche/P335E/2/

what's the simplest way with bootstrap.css to achieve this?

<div class="span8">

<h2>Kutcher</h2>
<ul class="media-grid">
 <li>
 <a>
 <img alt="mashable" class="thumbnail" src= "https://api.twitter.com/1/users/profile_image?screen_name=aplusk">
</a>
</li>

</div>

Upvotes: 3

Views: 7137

Answers (2)

Oleksandr G
Oleksandr G

Reputation: 2215

I used the following code to aligh right:

<div class="pull-right">Text at right side</div>

Upvotes: 1

Josh Smith
Josh Smith

Reputation: 15042

If you want to use media-grid, you can just hack on the CSS a little to produce this result: http://jsfiddle.net/P335E/3/

However, I would recommend against using media-grid if your use case is a single image and user name. Instead, you should really use some custom HTML and CSS. For example, an a.user with floated img and h2 sub-elements would work fine.

You can see the latter approach here: http://jsfiddle.net/P335E/4/

Upvotes: 4

Related Questions