#having him be the first to make a test dummy so they themselves could workshop methods for
Explore tagged Tumblr posts
Text
Warning for discussion of Jingliu leaks… again
While I am heavily uncertain of what exactly happened to make Baiheng into Bailu, I am very convinced she wasn’t the draconic abomination
Mostly due to the fact that Jingliu is said to have killed it, like definitively brought about the end of its life.
However, I also think she isn’t the draconic abomination because we know that the draconic abomination is a result of the experiment Dan Feng was conducting to create a new High Elder after being lied to by the Preceptors. Now perhaps he was blinded by grief and ended up being stupid as hell and not thinking about this part, but why would he try to make one of his friends into the new High Elder knowing that they would be condemned to an awful life and future lives of being controlled by the Preceptors and that loss of identity he was trying to run away from or at least seemed to have a desire to escape from.
Of course again, maybe Dan Feng wasn’t thinking and was solely focused on creating a new life, but yeah, highly doubt Baiheng/Bailu was the draconic abomination and either she was a separate experiment Dan Feng might have been involved in or,, dare I say it, she was an experiment he wasn’t actually that involved in. Perhaps instead something cooked up by the Preceptors having witnessed Dan Feng’s failure…
#HMMMM#imagine if them setting Dan Feng up for failure was actually not only to gain more control of him but also#AHAHAHHA#having him be the first to make a test dummy so they themselves could workshop methods for#creating a new artificial high elder#and they proposed to him a method to see if it would fail while still in the early stages of fine tuning it#and in the end bailu came to be from one of their later experiments…#im having a brain blast guys#and my brain blast is telling me FUCK THE TLC AND THE PRECEPTORS#FUCK EM#FUCK THOSE BTKCHEEESSSS#dan feng#dan heng#baiheng#hsr bailu#hsr#honkai star rail#hsr leaks#hsr theory
25 notes
·
View notes
Text
Marinette: Iron Man’s Minion: Rising
Over 30 people sent me ask requesting a sequel. I usually don’t do sequels. Its messy and rarely as good as the first. Hoepfully, you like this.
Tony just sighed at sight four kids and his robot picketing his workshop. Rhodey just looked overly pleased. The sun was had rose. He had just finished up for the day. Only to be met with… whatever the hell this was.
Honestly, he hadn’t thought they were serious. At least he didn’t think Peter was serious. Peter was the sweet one; 90 percent of time, he followed Tony’s rules to the letter, never giving too much problems.
…Harley, on the hand, liked to start shit.
“What we want?” Harley called again.
“No curfews!” The other three, Peter, Riri, and Marinette yelled.
Riri liked to instigate.
As for Marinette, Tony was certain at this point, she just wanted to see the world burn.
“When do we want it?!”
“Now!”
Dummy beamed loudly. A little sign in his claw.
Tony pinched his nose, “I swear to god, Harley.”
Harley smirked, “He says our sugar intake should be limited. I say we want candy. I say Sugar High and Die.”
“Sugar high and Die!”
Dummy beamed again.
Tony glared at his firstborn, “You can’t even eat.”
“Unlimited lab access!”
“Yes!”
“Breakroom for Interns,” Harley sniped. “We are not Avengers. We shouldn’t have to share with Avengers.”
“Not my Pop tarts!” Riri shouted, a big grin on her face, framed by her wild dark curly locks.
Marinette was having the time of her life, “Death to Baby monitor protocols!” Ever since it was revealed she was Ladybug, Tony put her on the same restrictions at the other teen Heroes. Karen watching her from her new, Stark approved, mask.
The others went nuts. “Death to Baby monitor protocols!”
Rhodey looked smug, “Karma.” He said easily. “For everything you ever put me through at MIT; you have to deal with four versions of yourself.”
Tony narrowed his eyes, “Okay time for the big guns,” He spun around. “PEPPER!” He yelled. “Jarvis get Pepper.”
The kids looked at each other and braced themselves.
“We will not go quietly into the night,” They all said together. “We will not vanish without a fight!”
“Oh my god,” Rhodey said, looking like a five-year-old on Christmas morning. “They’re doing the speech from Independence day!”
“We're going to live on!” The kids said, dummy beeping with them. “We're going to survive! Today we celebrate our Independence Day
“PEPPER!” Tony screamed again.
First thing, Tony said when the redhead arrived, “Pepper, the minions are revolting. Do something!”
“Well maybe if you didn’t call them minions,” Pepper suggested just looking so done with the world. She could just barely believe Jarvis when he told her the interns, and teen heroes, were protesting. “And why is Rhodey holding a sign?”
Tony huffed, “The twerps called him Uncle Rhodey with those big puppy dogs’ eyes. And he went full traitor!” He explained. “Those things should be weaponized. Fix this!”
Pepper sighed and walked to Harley, the one with the megaphone was usually the leader. She smiled, “Lets negotiate.” This would be easy and over quickly. They were just kids, messing with Tony.
Marinette stepped forward, “Sure,” She smiled pleasantly. “After our lawyer gets here.”
“You’re what now?!!” Tony shouted.
Pepper eyed the bluenette approvingly. “Bring it on!”
Matt Murdock had no idea that when Spiderman called to ask him to his lawyer and defend his rights, that he was talking about Peter Parker’s rights as an intern. He was on the avengers’ roster and most knew he identity. Foggy was confused but elated to test his wits against the force that was Pepper Potts.
The two lawyers sat across from Tony and Pepper. The kids and Rhodey, who Stark called traitor every time he spoke, sat beside them. They were in a conference room at a large table.
Matt began, “Our clients have made their requests very clear. Most of which are easy to employ and some would say are their rights.
“Their minions,” Tony stated. “They don’t have rights.”
Pepper placed a hand on his shoulder, “Never say that again,” She said slowly.
“All employee should have a breakroom,” Foggy stated. “Even interns. It’s non-negotiable.”
Pepper nodded, “Agreed. They will be given their own breakroom; that Jarvis will ensure only fellow interns will have access to.”
“That means Tony can’t go in,” Peter laughed.
“You little shit!”
“Baby monitor protocols are too extreme,” Matt said.
Pepper pinched her nose. “As a hero yourself, Mr. Murdock, you must understand that we in good conscience cannot allow minors, even superpowered minors, to perform their heroics without proper supervision.”
Riri slammed her hands on the table, “I was a little late for curfew and you sent freaking Thor to track me down,” She said accusing to Tony, who looked completely unrepentant. “Thor. A god.”
“Alien,” Rhodey and Tony chimed.
“I snuck out one time,” Peter glared. “And the Avengers crash a house party.”
Pepper winced. That had been a PR mess. “Tony will limit his use of GPS tracking provided all parties adhere to the rules and regulations they originally agreed to when they began their mentorship under Tony.”
“You mean when we sold our souls to the man,” Marinette snipped.
“The-The man?” Tony looked flabbergasted. “No! What?”
The meeting went on for another thirty minutes. It was nearly adjourned when Pepper inquired if there was anything else.
Marinette looked Tony dead in the eyes, “Karen no longer reports to you.”
The other kids blinked in surprise before grinning.
Tony leaned back in his seat, and nodded solemnly, “So its war you want.”
“Oh my god,” Pepper and Matt groaned.
Foggy and Rhodey looked far too entertained for their own goods.
Eventually it was agreed that Karen would report that if they were in any danger and agree to disclose if the young heroes were fine or not. Plus any messages they wanted to relay. Pepper didn’t budge on the candy issue; citing parents had enforced a healthy diet rule on the summer internships. Instead, the kids got a pool table to the breakroom and unlimited healthy snacks for the fridge provided at Stark Industries expense. But they would not dictate what the kids bought on their own.
Marinette had been living at the tower for a month. One morning she decided to make herself her favorite dessert; chocolate and mint AND chocolate and raspberry macrons. She made little over a dozen and had left them in the fridge, a clear ‘Do not Touch’ sign on them.
When she finished with Tony and the other interns for the day, Marinette washed up and rushed to the kitchen to get snacks so she could start binging watching Batman the animated series. However, when she got to the kitchen, opened the fridge, she saw her beloved snacks gone.
Marinette eyes narrowed and she hissed. She marched into the living room and saw the plate she had used lying on the coffee table. The avengers sat watching TV. Marinette picked up the plate, “I made macarons for me. I left them in the fridge with a sign that said do not touch. Someone obviously can’t read. Who did it?”
The heroes shared looks. No one answered.
“I’m not mad,” Marinette promised. It was lie. By the looks on their faces, they knew a trap when they heard it. “I just want to know the truth. I know it can’t have been Tony or Bruce, because they were with me in the workshop. Natasha is out with Pepper. So…”
Nothing.
Thor shifted uneasily. Bucky blinked innocently at her. Steve gave her a boy-ish grin. Clint looked vaguely terrified. Sam kept eyeing the window like it was an exit. Scott looked seconds away from calling for back up.
“Oh,” Marinette nodded. “It’s like that. Fine then.” With that she marched out of the room in a huff.
When she was gone, Bucky sighed, “She’s going to make us pay for this.”
“One of is just going to go missing,” Sam nodded.
Clint shrugged, “Sorry, Scott.” And went back to watching TV.
“Yea-What?” Scott yelled. “What do you mean Sorry Scott? Why is it me?”
The next morning, the heroes woke up to find… things missing. Steve couldn’t find his shield. Bucky’s arm was gone. Thor’s hammer was missing and would return to matter how much he called for it. Clint’s was missing his custom arrows were. Sam’s AI redwing had vanished. And as far Scott, well…
No matter how much they searched, they couldn’t find their missing stuff.
They all arrived back at the living room, wondering what the hell was going on. They figured one of Tony’s cleaning bots had gone haywire… Again. But that didn’t explain how no one realized it happening. Maybe it was Loki. Still they decided to talk to Tony first. Natasha was with him, and thoroughly amused at the sight of the ruffled men.
The genius had looked confused, “No. My bots are all up to date. They didn’t even clean last night.”
Thor nodded, “Then it was my brother. I shall have to speak with him at once.”
“Wait,” Steve said looking around, “Where’s Scott.”
…And as for Scott? Well, he was missing.
Bucky’s eyes narrowed, “She has him.”
“Well shit,” Clint said. “I was just joking yesterday.”
“I’ll miss the little dude,” Sam whined.
Tony looked around, “What are you? No!” He laughed. “Marinette? Frenchy took your stuff? You’re the world’s greatest heroes! She is a fourteen-year-old girl, you know that, right?” He chuckled. Lil Dominator strikes again.
“Natasha,” Steve sent pleading eyes to the Spider.
“I’ll talk to her,” The Black Widow sighed, “But she’ll never respect you if you don’t fight your corner.” With that, she left to speak with Marinette.
Natasha came back ten minutes later looking rather disgruntled, “She said no.” She told them. “Something about macrons and vengeance. And feeling her wrath. I think you created a supervillain.”
“No,” Tony chimed in. “No supervillany anything. Until she’s twenty-one. It’s in the minion’s contracts” He had made sure to add if after they threated to riot of the good grade addendum; anything lower than a B, and patrol is cut. “She’ll stick to her word.”
“Your interns have contracts?” Clint asked.
Tony just shrugged, “They do now.”
“Let’s all go talk to her,” Steve suggested. “We’ll apologize and everything will good again.”
This caused Tony to cackle. “Yeah, okay!”
The heroes found Marinette on the roof with the other interns. The avengers and the minions eyed each other.
Marinette spoke first, “I want three dozen macrons from the French bakery on 8th street, near Franky’s deli; all chocolate. Then you get your things returned.”
“You can’t just,” Bucky began. “That’s blackmail.”
“Its extortion,” Riri corrected.
“Marinette, how about…” Sam started but Marinette cut him off.
She crossed her arms, “This isn’t negotiable.”
“Where’s Scott?” Clint asked. “How do we know he’s alright? We want proof he’s alive.”
Peter leaned toward Harley, and whispered. “Hey, it sounds like they think we kidnapped him.”
Harley leaned back, “That’s because technically we did. I think we’re a crime syndicate now.” (Peter yelped, “What?!). “Shhh. Just go with it.”
Marinette pulled out a walky talky, and headed it to Clint.
“Hey Scott, you there, over,” Clint asked into the radio.
“Help!” Scott’s voice screamed from the radio. “Giant hamster. Giant mean hamster. Oh god why?”
“He’s name Sir Grumpy paw,” Riri said brightly. “I have to keep him here now. He tried to take out my mom’s cat.”
Bucky just looked at Steve, “Can we just get her the damn macrons.”
“No!” Steve said. “We can find Scott and our things.” He promised. “You’ve gone too far,” he told Marinette.
The bluenette grinned, “Oh captain, I’ve only just begun.”
Steve stalked off with the other guys trailing behind him.
An hour later, Thor was missing...
“She took out a god,” Clint yelled. “Anyone could be next.”
Sam used the radio to try and communicate teammates.
“Good spirits, friends,” Thor said. “I shall conquer the vile beast Sir Grump Paws. And return victorious.”
Bucky was gone by the next hour. “What the fuck is wrong with this hamster?” The greatest assassin in history yelled once they contacted him via radio. “Who taught its fatass how to glare.” It went quiet. “Stevie, I… think it understand English. Shit.”
“Marinette took out the Winter Soldier,” Natasha said with raised eyebrows. “Impressive.”
Sam went after that.
“Oh god, oh god, oh god,” Sam just kept repeated. “We’re in a maze. Plastic tubes. We’re running. It’s after us, Steve. The hamster is after us.” It went quiet. “… I think it ate Scott.”
Steve sighed, “Can you just talk to her?” He pleaded with Tony, “Clint’s freaked out.”
“Can’t,” Tony said. “Contract. Tony Stark cannot interfere or choose sides in an event of a Minions vs Avengers war.”
“Damn it,” Clint shouted. “This isn’t a war. This is an execution. They’re taking us out one by one, man.”
“Shouldn’t have at her macrons,” Tony smirked, proud of his minions. “She knows it was you by the way.” He told Clint. “She knows you were the one to take them.”
Clint gulped.
He went missing ten minutes later.
“Cap,” Clint’s voice came from the radio. “We’re going to do it. We’re going after Sir Grump Paws. It’s time. We can’t live like this, not under his reign. That monster has to be stopped. If we don’t make it, just, just… Tell our story. Tell Nat, I’ll miss her. My sister and her kids, they get all my stuff”
Steve just looked up at the ceiling, and just looked so done with the world. He got up and went to find the interns, “What are you demands?”
An hour later, he came back with four dozen macrons, a dozen cupcakes, sticky cheese, peppers, and a pound of gummy worms. He sat the goods on the counter. Natasha, Tony, Rhodey, and Happy looked stunned.
“You… surrendered?” Tony asked perplexed.
“Captain America doesn’t surrender,” Rhodey stated.
Happy shook his head, “You can’t give in, Cap. I know these rugrats. You gotta set boundaries.”
Steve just shrugged, “Eighty percent of our team is missing. They just want junk food.”
“It’s a good trade,” Marinette said as she led the other interns, including Pepper’s intern MJ and tech Intern named Ned, into the kitchen. She held the Captain’s America shield proudly. Peter carried Bucky’s arm. Thor’s hammer floated behind Riri, carried by Plagg and Trixx. Harley had redwing and Clint’s arrow. The kids placed the weapons down on the table.
However before they could grab the goodies, Steve crossed his arm, “Nope. My friends first!”
“Right behind us,” Riri said.
Suddenly a squeaky voice was heard, “I have vanquished the dreaded foe, Son of Rogers.”
Everyone looked down.
In five different hamster balls, were the missing avengers, looking like they just fought a war?
“Why are they tiny?” Tony pinched his nose.
Mj shrugged, “How else were they supposed to have gladiatorial death matches with a hamster?”
“Oh, of course,” Tony said sarcastically. “Silly me.”
It took the tiny avengers half an hour to get back to normal. Hamsters were added to the tower’s banned list.
Fury showed up later that day. He glared at the interns, Stark’s minions; Ladybug, Spiderman, Iron Heart, and WarIron, “I’m here to talk to you about the Avengers Initiative.”
“No, you’re not!” Tony yelled from wherever he was.
Marinette woke up a few days later; thirsty. She saw it was close to midnight so she decided to rush to the kitchen to get a glass of milk. As she headed to the kitchen, she saw something out the corner of her eyes that had her quickly backtracking.
In the dining room was Loki, Bucky, Tony, Natasha, Rhodey, Clint, Plagg, Wayzz, and Trixx siting around the table, playing what looked to be poker.
“The girl who tormented by brother and the avengers,” Loki said approvingly. “With a rodent.”
Marinette nodded, “Deal me in.”
She’d sleep when she’s dead.
The next day, Steve and Pepper would both find themselves knocking on Marinette’s bedroom door. One to get an arm back. The other the keys to Tony’s Lamborghini. Only to find Thor already there requesting his brother’s helmet back.
Gambling with Marinette was added to the Tower’s banned list.
#ml fic#ml salt#Avengers#tony stark#steve rogers#marinette dupen chang#Marinette deserves better#pepper potts#thor#loki (marvel)
3K notes
·
View notes
Text
Honestly, Pepper
Written for the @tonystarkbingo, S4 – Writing format: non-linear.
Relationship: Tony Stark & Pepper Potts, Avengers Team
Tags: Crack, Dialogue-only, Non-linear Narrative, Disaster Domestic Avengers, For Want of a Nail
Words: 963
Summary: Pepper Potts, CEO and sometimes superhero-wrangler, walks out of the elevator onto the Avengers Tower common-floor and stops in shock. How is this even her life? And why is she not surprised?
On AO3 and below the cut.
“Tony! What is this mess? I was only gone for three days.”
“Honestly, Pepper, it’s not my fault. And the first two and a half days were fine.”
“Then what is… how… Why do you have the Iron Man gauntlet?”
“Honestly, Pepper, you can’t expect me to make do with cutlery when I have a better alternative available. Still, I have to admit I never realised just how many sharp objects we had in our kitchen. Clint, on the other hand, apparently knows exactly how many, and decided to give us a demonstration. Turns out his aim is just as good without a bow. The same can’t be said for Steve, however, vibranium definitely holds up to his fighting style better than steel saucepan lids. It’s probably lucky for our kitchen implements that Natasha showed up when she did. Seriously, the Black Widow, in pink pyjamas and fluffy socks, armed with only a teaspoon—I’ve never seen anything more terrifying. I reckon the HYDRA agents must have agreed, because things calmed down pretty quickly after that. They almost offered to tie themselves up.”
“How did HYDRA agents end up in the Tower!?”
“Honestly, Pepper, who could have expected that they’d find a way to climb up 80 floors through the air vents? There’s a reason it’s not included in JARVIS’ security protocols; not even Clint goes more than a few floors down. Of course, they weren’t anticipating just how thoroughly he would defend what territory he has claimed. With a creative mind, apparently there are all sorts of traps you can leave for the unwary, all without significantly disrupting the airflow. They did pretty well at avoiding them—that’s how they got as far as they did—but someone must have lost focus when the bunny exploded and tripped something. I’m not sure who was more startled by the agents suddenly dropping from the ceiling; them or us.”
“Bunny… exploded?”
“Oh, not a real rabbit; the giant stuffed one I got you. Honestly, Pepper, it was the cutest thing—Jarvis took photos for later. Well, Hulk decided that smash wasn’t needed and he wasn’t in the mood for it anyway. So when he saw the bunny over in the corner, he made a b-line and grabbed for it. I’ll admit I was worried for a moment, but he just sat himself down and started hugging the metaphorical stuffing out of it. Seeing the two of them together, Hulk looked so much like a happy, cute, green toddler. Kinda forgot how big he is. Then he started playing and making the rabbit hop around—I wonder where Hulk learned about rabbits jumping? Of course, while the rabbit might be Hulk-sized, the room isn’t. So one time the bunny jumped too high, and hit the ceiling fan; fan 1, bunny 0, and stuffing spread all across the room. On second thoughts, maybe it was Hulk flattening the fan in retaliation that knocked the HYDRA agents loose; everything got a bit chaotic around then.”
“But, why was the Hulk even out?”
“Honestly, Pepper, that’s probably Dummy’s fault, but he was just trying to do his job. I had him out of the lab because I wanted to see how his new wheels handled on carpet. But you know how excited he gets over his fire extinguisher. So when he saw the fire, he might have gotten a tiny bit overenthusiastic trying to put it out. Hence, the foam everywhere. And Brucie-bear might have been sitting a little too close and gotten whacked over the back of the head with the canister. Then turned and gotten a face full of foam. But Hulk realised really quickly that it was just an accident, and Dummy’s only slightly dented, so everyone’s fine.”
“Hmm. And just what was on fire?”
“Don’t look at me like that. Honestly Pepper, it was just Thor trying to make breakfast. Only, you know what he’s like. I’m not sure I’ve ever seen anyone who can mangle scrambled eggs that badly; even I can make a passable omelette! And don't get me started on his battles with the toaster. He tries, but he just gets so frustrated. And when you have a frustrated god of thunder around a bunch of electronics, well… that’s why the kitchen is one of the areas with its own fire suppression system. Except, apparently it didn’t go off this morning. I know I borrowed the sensor element for testing one of my projects last week, but I could have sworn I put it back in. I’ll have to check once we finish clearing the rubble. Otherwise, I suppose it might still be buried down in the workshop…”
“So let me get this straight. Thor set his breakfast on fire. So Dummy tried to put it out, and ended up setting off the Hulk. Who decided to play with my stuffed rabbit and destroyed it with the ceiling fan. Then HYDRA agents fell out of the roof and were fought off with cutlery and Natasha’s glare. Have I missed anything?”
“I don’t think so… wait! You might want to avoid the pantry for the next few hours. We stashed the HYDRA agents there until SHIELD can come pick them up.”
“I’m not even… Fine. So, out of all that, what is this red stain on the carpet? I know it’s not blood… and I hate that my life is such that I can tell that at a glance.”
“Stain? Aw, someone squished my strawberries. I wanted to give you a welcome home present.”
“You got me strawberries? AGAIN?”
“… sorry.”
#i know pepper's bunny was at the malibu house#and probably got blown up#but they retrieved it or got a replacement#the mental image of the hulk with it was too cute to resist#avengers#tony stark#pepper potts#disaster avengers#avengers family#crack#fanfic#tonystarkbingo2019
7 notes
·
View notes
Text
13 Best Ways to Learn CSS Grid
CSS Grid an increasingly popular method for creating complex responsive web design layouts that render more consistently across browsers. Now is the time to familiarize yourself with CSS Grid, so we’ve collected 13 of the best ways to get started learning today.
Rather than old-school methods such as tables or the box model, CSS Grid allows you to create more asymmetrical layouts and more standardized code that is cross-browser compatible. Most major website browsers already support CSS Grid and it is a W3C Candidate Recommendation, which would formalize it as a standard practice. It’s widely believed that CSS Grid will be the future of website layouts.
1. MDN: CSS Grid Layout
Mozilla has great resources in the MDN Web Docs guides, proving simple explanation of how things work and code examples to get you started.
Here’s what MDN says about CSS grid:
CSS Grid Layout excels at dividing a page into major regions, or defining the relationship in terms of size, position, and layer, between parts of a control built from HTML primitives.
Like tables, grid layout enables an author to align elements into columns and rows. However, many more layouts are either possible or easier with CSS grid than they were with tables. For example, a grid container’s child elements could position themselves so they actually overlap and layer, similar to CSS positioned elements.
The documentation offers code and examples plus elements that you can open and play with on your own in CodePen or JSFiddle. This might be the best starting place in terms of thinking about CSS grid.
2. Learn CSS Grid
Learn CSS Grid is a guide to learning the technique from Jonathan Suh, based on the method in which he learned it. The guide is well-organized and starts with a table of contents that allows you to jump from section to section.
This guide is easy to follow – some coding knowledge required – and is a great resource for CSS grid beginners. Each element comes with a visual example, which might be the key piece in bringing all the information together.
3. Tuts+ Guide to CSS Grids
Tuts+ has built a complete guide to help you learn CSS Grid, whether you’re just getting started with the basics or you want to explore more advanced CSS. It’s done through a series of clear and thorough tutorials, with practical examples throughout.
4. Codeacademy: Introduction to Grids
Codeacademy has long been one of the best places to learn coding skills in a practical format. While you do have to create an account to access the tutorials, it is a great way to learn using a lesson-plan based format.
Here’s the description of the Introduction to Grids course:
In this lesson, we introduce a new, powerful tool called CSS grid. The grid can be used to lay out entire web pages, Whereas Flexbox is mostly useful for positioning items in a one-dimensional layout, CSS grid is most useful for two-dimensional layouts, providing many tools for aligning and moving elements across both rows and columns.
Codeacademy course can be taken in sequence – start at the very beginning if you are completely new to backend web design – or on their own. It’s free to create an account and take many of the courses.
5. FreeCodeCamp: Learn CSS Grid in 5 Minutes
Get what CSS grid is about and only have a few minutes to really dive into it? This quick start tutorial from FreeCodeCamp will help you get familiar with it in just five minutes. (Granted you need to know some basics already.)
Here’s the takeaway: “The two core ingredients of a CSS Grid are the wrapper (parent) and the items (children). The wrapper is the actual grid and the items are the content inside the grid.”
The 5-minute guide also includes relevant markup.
6. The CSS Layout Workshop
The CSS Layout Workshop is a set of paid courses from Rachel Andrew, one of the leaders in CSS grid work. The courses are an online, self-study program that are ideal f you like more structure to learning something new.
To see if this course is right for you, the first part is free. It focuses on CSS basics and explains all the basics you need to go deeper into the material. The good thing about the complete set of courses is there aren’t any additional costs; you just need a web browser and text editor to get started.
7. Game: Grid Garden
Grid Garden is a game that uses CSS to grow a successful carrot garden. It’s a good primer on how CSS properties work to get you in the right mindset to think about CSS grid.
And well, it’s a lot of fun. See if you can make it through all 28 levels.
8. Grid by Example
Grid by Example shows how different CSS grid configurations will look in supporting browsers. Each grid configuration includes a visual example with links to pages with more information about the technique and the code.
There’s a fun bonus as well with dummy page layouts so you can see how different CSS grid examples look with real content applied to them.
9. Video: Learn the CSS Grid
If learning via seeing someone do something is more up your alley, watch the Learn the CSS Grid video. (It also has accompanying text.)
The 18-minute video is a quicker starter tutorial that the maker hopes will “facilitate your eagerness to explore the full potential of the CSS grid.”
The video takes you through setting up a project, defining the HTML, defining some basic rules, defining grids, nesting the CSS grid and template areas and a few responsive tricks. The video and text include screenshots of all the markup.
10. CSS-Tricks: A Complete Guide to Grid
CSS-Tricks has long been one of the go-to places to learn about coding. The Complete Guide to Grid is no exception. The guide, which was published in November 2017, is an up-to-date primer on the 2D system.
This guide is fantastic and broken into digestible sections.
But the best part might be the gallery of CSS grid in action. Make sure to spend some time in the gallery for inspiration.
11. CSS Grid Ask Me Anything
Have questions about CSS grid? Ask an expert.
This Git includes simple questions and answers from Rachel Andrew. While she only answers reduced questions, it is still pretty helpful. Just make sure to follow the ground rules.
12. Video: Progressing Our Layouts
Jen Simmons shares her talk from the 2016 Enhance Conference for users. The 30-minute video walks through examples of CSS grid in action and she touches on how to write code in a time of transitioning techniques.
Watch the video and then you can also go through the slide deck as well. The pair is pretty useful for thinking about CSS grid in broader terms.
13. CSS Grid Playground
Ready to test all those CSS grid ideas and skills? The CSS Grid Playground includes grid container and grid items locations so you can start coding and see what happens in real time.
It’s a good way to get comfortable with the basics and see changes as you make them. (It almost feels like a game.)
Conclusion
Stop procrastinating if you haven’t taken the leap into at least familiarizing yourself with CSS grid. Make it a goal to get comfortable with best practices so that you can better understand how it works and how to use it.
Here’s a shout out to all the folk out there who are providing great resources about CSS grid. You have to admit the web design and development community is pretty amazing when it comes to knowledge sharing. If you use one of these lessons or tutorials and get a benefit from it, make sure to share the love with the author and let him or her know they’ve helped you.
0 notes