April 19th, 2013, 12:41 PM
-
Wrapping text in a fixed position element
I have a left side navigation element (fixed position so it's always visible), and a title that does not fit inside of it. I would like the title text to wrap to the next line so it fits, but it's not happening. Below is the CSS & html codes:
Code:
#left_nav {
font-size: 12pt;
color: #2F8154;
float:left;
width: 13%;
min-width: 10em;
position: fixed;
}
Code:
<div id="left_nav" class="navigation">
<h2>Table of Contents</h2>
<ul>
<li><a href="#paper">Term Paper info</a></li>
<li><a href="#bio">Biography</a></li>
<li><a href="#resume">Resume</a></li>
<li><a href="#personal">Personal Info</a></li>
<li><a href="#five">5 more things</a></li>
<li><a href="#links">Links</a></li>
</ul>
</div>
I tried applying the same width to the h2 element inside the navigation id but it still overflows, same with adding an overflow property (none of the options keep it in)
April 19th, 2013, 04:16 PM
-
It seems to work like you say. Which browser are you using? IE7?
April 19th, 2013, 05:35 PM
-
Originally Posted by brandan
It seems to work like you say. Which browser are you using? IE7?
I was using it in Chrome at work... just tried it at home in Chrome and it works (same with other Firefox here, didn't try that before). No idea why it wasn't working at work, but it's all good now!
April 20th, 2013, 03:42 PM
-
April 22nd, 2013, 08:56 AM
-
Back at work and tried again, still not working in Chrome, or IE (didn't check IE Friday), does work in FF though. Don't think a reinstall of Chrome will matter if it does it in IE too.
Not sure why it works at home in all 3 but at work in only 2/3, but I'm not going to worry about it for now since it works at home, hopefully it works for my professor when I turn in my hw too!
April 22nd, 2013, 11:00 AM
-
No sure what I did to fix it, but it's all working now!