Register a SA Forums Account here!
JOINING THE SA FORUMS WILL REMOVE THIS BIG AD, THE ANNOYING UNDERLINED ADS, AND STUPID INTERSTITIAL ADS!!!

You can: log in, read the tech support FAQ, or request your lost password. This dumb message (and those ads) will appear on every screen until you register! Get rid of this crap by registering your own SA Forums Account and joining roughly 150,000 Goons, for the one-time price of $9.95! We charge money because it costs us money per month for bills, and since we don't believe in showing ads to our users, we try to make the money back through forum registrations.
 
  • Post
  • Reply
MREBoy
Mar 14, 2005

MREs - They're whats for breakfast, lunch AND dinner !
Soliciting help with CSS ok in here or is there another suggested thread ? has to do with width/placing of something on a page

Adbot
ADBOT LOVES YOU

MREBoy
Mar 14, 2005

MREs - They're whats for breakfast, lunch AND dinner !
ok so - I try to maintain a 2+ year old abandon-ware'd Node.js app related to a game I play (https://forums.somethingawful.com/showthread.php?threadid=3893821). It's a type of real-time collaborative map surface you can do stuff on. In the upper right corner is a button you can click that drops down a menu that lets you click an area name to move to it w/o having to zoom/scroll. Game is going to be updated in about a month and the # of things in this drop down box is going to have to be expanded so that what is now 7 columns will become 9. Based on previous attempts at messing with things I know this drop down box is a fixed width. I have a general idea on how to add the new info but not how to expand the box width.



I poked around in Firefox F12/element inspection and from what I can see the following bits of code "covers" this box when I mouse over it:

code:
<div class="dropdown-menu dropdown-menu-right show" id="filter_panbody" x-placement="bottom-end" style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(-316px, 29px, 0px);">
<div class="btn-group btn-group-sm region_pan_btn_group">



I have a copy of the source for this site and searching through it for dropdown or panbody or btn-group has hits in 3 different CSS files. No idea where to start. If needed/wanted I can give you access to the working site and/or the github repo for the source. Feel free to DM me here or on Discord:just "mreboy"

MREBoy
Mar 14, 2005

MREs - They're whats for breakfast, lunch AND dinner !

prom candy posted:

Not sure how it works in FF but in chrome if you look at the computed styles tab it will show you which CSS rules it used. I'm sure FF has something similar

Poked around a bit more with the Firefox inspector -
Yay: found an entry in a CSS file that controls the box width, changing a 100% to 150% expands the box nicely.
Boo: Half the box is now cut off to the right.
Yay: Found another line that reads "position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(-316px, 29px, 0px);", changing the -316px in the inspector to about -490 drags the box over to the left enough that you can see it again.
Boo: This -319px line is in something called "inline" and appears to be generated automagically somehow so IDK how to change this.

  • 1
  • 2
  • 3
  • 4
  • 5
  • Post
  • Reply