0

Using responsive twitter bootstrap.

I have a page with 3 span 3's:

<body>
<div id="wrap">

<div class="container">
    <div class="row">
       <div class="span3">
          <img src="~/Images/logo.png" alt="Logo" />
          <br /><br /></div>
       <div class="span3 cfnav">
          <ul class="nav nav-tabs nav-stacked">
             <li><a href="#">Home</a></li>
             <li><a href="#">Info1</a></li>
             <li><a href="#">Info2</a></li>
             <li><a href="#">Info3</a></li>
             <li><a href="#">Info4</a></li>
          </ul>
       </div>
       <div class="span6" style="background-color:green;"><br /><br /></div>
</div></div></div></body>

The logo resizes automatically depending on the responsive width of the page. However the text stays the same size - overspilling its DIV at bigger widths.

Is there any way to set the text size to change dynamically - as the image stretches to stay within the span3 div? (without having to manually set the text size at each media query width)

niico
  • 11,206
  • 23
  • 78
  • 161
  • 2
    Take a look at [this answer](http://stackoverflow.com/a/14537671/1313268) – CorayThan Jun 19 '13 at 07:55
  • from what I can tell that just uses media queries - so you'll manually set the font size at various widths (which I'm already doing)?! – niico Jun 19 '13 at 08:35
  • I guess the answer is probably no then. At least I don't know any way to do what you want to do. – CorayThan Jun 19 '13 at 15:11
  • Possible duplicate of [Bootstrap Responsive Text Size](http://stackoverflow.com/questions/14537611/bootstrap-responsive-text-size) – kapa Oct 07 '15 at 07:35

1 Answers1

0

You could take a look at using rem units for text sizing, although it would require tweaking Bootstrap heavily: http://css-tricks.com/theres-more-to-the-css-rem-unit-than-font-sizing/

2507rkt3
  • 21,311
  • 1
  • 18
  • 15