Dark Qiviut 22,126 October 25, 2015 Share October 25, 2015 (edited) For at least a month (since transitioning my computer to Yosemite), the textboxes have been bleeding out of their containers. As a result, it becomes impossible to check anything underneath (including creating polls). Here's an example: I don't know the cause of the problem. Edited October 25, 2015 by Dark Qiviut 1 Link to comment Share on other sites More sharing options...
Lightwing 12,955 October 25, 2015 Share October 25, 2015 @Dark Qiviut: Which browser are you using currently? Are you using any addons while you are creating Topics and/or browsing MLPF? Also, have you tried clearing the browser's caché? 1 Link to comment Share on other sites More sharing options...
Dark Qiviut 22,126 October 25, 2015 Author Share October 25, 2015 Which browser are you using currently? Firefox 41.0.2. Are you using any addons while you are creating Topics and/or browsing MLPF? Other than AdBlock, no. Also, have you tried clearing the browser's caché? Eeyup! Doesn't work. 1 Link to comment Share on other sites More sharing options...
Dark Qiviut 22,126 November 6, 2015 Author Share November 6, 2015 I'm now using Firefox 42.0. The problem still exists. 1 Link to comment Share on other sites More sharing options...
galaxysquid 2,121 November 12, 2015 Share November 12, 2015 Have you tried turning it off and then back on again...? Nah I'm just kidding. Could it be possibly the resolution of your screen glitching? Have you tried using a different browser? 1 Link to comment Share on other sites More sharing options...
Dark Qiviut 22,126 November 28, 2015 Author Share November 28, 2015 Have you tried using a different browser? Used Chrome. The textboxes don't bleed. 1 Link to comment Share on other sites More sharing options...
Odyssey 5,710 November 29, 2015 Share November 29, 2015 I'm not sure if your Mac offers this yet, but can you change from Yosemite to El Capitan? I tend to update my Mac as soon as a new operating system gets released. I'm not sure if that would make a difference, but all I know is that El Capitan is a free update. 1 Link to comment Share on other sites More sharing options...
Jokuc 8,172 December 3, 2015 Share December 3, 2015 Odd, I use Firefox and I don't have this problem. It might be something with your OS not being too friendly with Firefox. 1 Link to comment Share on other sites More sharing options...
Dark Qiviut 22,126 December 24, 2015 Author Share December 24, 2015 (edited) @@Lightwing, @@PrincessWubsy, @@Odyssey, @@Jokuc, Since this semester, I've been using the Inspect Element tool on my Firefox browser to try fixing it. What I noticed was this: <li class="ipsField ipsField_primary"> <label for="entry_title" class="ipsField_title">Entry Title</label> <p class="ipsField_content"> <input id="entry_title" class="input_text" size="70" maxlength="150" name="EntryTitle" value="" tabindex="1" type="text"> </p> </li> This is the html for the list item inside the unordered list. There's a main input box for the blog title as well as the classes and ID's for the paragraph and input, respectively. As a result, I went after the html with the Inspect Element tool for my Firefox. First, here's the css for .ipsField_content within .ipsForm_vertical: .ipsForm_vertical .ipsField_content { margin-top: 3px; } I tinkered to contain the input, one of which was adding overflow-x: hidden and a margin. No dice. So, I went after the css of the input inside the unordered list and found this: .ipsField_primary input { font-size: 18px; } This is where it caught my attention. I don't know if your css has it, but the css here shows no set width. It might be automatic on Chrome, Safari, and other Firefoxes, but mine doesn't. The lack of width value is why the textboxes bled. So, with the Inspector, I changed it to this: .ipsField_primary input { font-size: 18px; width: 100%; } By adding "width: 100%;", the input box is now within the content. Unfortunately, the border of the input textbox touches the edge of the div. To fix that, I went back to the field content encompassing the textbox and added this: .ipsForm_vertical .ipsField_content { margin-top: 3px; margin-right: 10px; } Here's the before: Here's after I added the extra css: Keep in mind, Inspect Element is only for the current viewing. The css resets on my browser once I leave or reload the page. If this becomes permanent, you must add the values in yourself, and I'm not familiar with how you lay out your css via IP.B. For adding the tags for topic discussions, I went after the input class here: <p class="ipsField_content"> <input autocomplete="off" class="input_text" size="50" value="" name="ipsTags" id="ipsTags" type="text"> <br><span class="desc lighter">You may add up to 10 tags.</span> <script type="text/javascript"> document.observe('dom:loaded', function() { url_ipsTags = ipb.vars['base_url'] + 'app=core&module=ajax§ion=tags&do=find&meta_app=&meta_area=&meta_parent_id=&secure_key=' + ipb.vars['secure_hash'] + '&autocomplete=1&exclude=&find='; autocomplete_ipsTags = new ipb.Autocomplete( $('ipsTags'), { multibox: true, url: url_ipsTags, templates: { wrap: ipb.templates['autocomplete_wrap'], item: ipb.templates['autocomplete_item'] }} ); autocomplete_ipsTags.options.min_chars = 2; }); $('ipsTags').value = ''; // $( "ipsTags" ).tagify( {"isOpenSystem":true,"isEnabled":true,"minLen":2,"maxLen":30,"minTags":0,"maxTags":10,"predefinedTags":["Spoiler","Mega Thread"],"fieldId":"ipsTags","prefixesEnabled":false,"meta_app":"forums","meta_area":"topics","meta_parent_id":3,"lang":{"tag_add_link":"Add a tag","tip_text":"Type tags separated by commas..."},"forceLowercase":"0","existingTags":false} ); </script> </p> And added "width: 100%;" for the css there, too, like this: .input_text, .ipsTagBox_wrapper { padding: 4px; border-width: 1px; border-style: solid; border-color: #848484 #C1C1C1 #E1E1E1; background: #FFF none repeat scroll 0% 0%; border-radius: 2px; width: 100%; } The right margin values still apply. Hope this helps. ETA: Another suggestion for the textboxes for the thread tags: li.ipsField.tag_field input#ipsTags { width: 100%; } Edited December 24, 2015 by Dark Qiviut 3 Link to comment Share on other sites More sharing options...
碇 シンジン 27,427 December 24, 2015 Share December 24, 2015 Keep in mind, Inspect Element is only for the current viewing. dowload stylish addon on your browser and add the missing css with that 1 Link to comment Share on other sites More sharing options...
Jokuc 8,172 December 24, 2015 Share December 24, 2015 dowload stylish addon on your browser and add the missing css with that Greasemonkey would work as well but the problem shouldn't be there in the first place... 2 Link to comment Share on other sites More sharing options...
Jeric 46,833 December 25, 2015 Share December 25, 2015 I'll be personally looking at the template file for that page on the 26th. I'll let you know what I find and if I can resolve it myself. 2 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Join the herd!Sign in
Already have an account? Sign in here.
Sign In Now