CSS an Breakpoints

Beginners
1

Hello, I am currently working on web programming and testing 3 programs (Webflow, Dreamweaver and Pinegrow with Atom). Here’s my problem with Pinegrow:
I want to create a responsive layout (without using bootstrap). For the different views I want to use different definitions for the font size in CSS for the breakpoints, but unfortunately I am not making any progress here. I can create the breakpoints but how do I assign class to the different breakpoints? Can somebody give me a hint

2

You don’t assign classes to breakpoints, you assign breakpoints to classes with media queries. You can either write this out directly in your stylesheet using the @media rule
(example)

@media only screen and (min-width: 601px) {
  div.example {
    font-size: 80px;
  }
}

/* If the screen size is 600px or less, set the font-size of <div> to 30px */
@media only screen and (max-width: 600px) {
  div.example {
    font-size: 30px;
  }
}

Or you can use the tools in the CSS panel…

Untitled-1
Untitled-1.jpg884×700 176 KB

Hope this helps you.

2 Likes
3

Thank you for your help. It worked. I’m learning HTML and CSS. At the moment I’m testing between Dreamweaver and Pinegrow. What is better for learning and understanding?

4

I can’t really comment on Dreamweaver because I don’t use it.

5

Surprisingly enough, this board would favour Pinegrow - asking the same on the Dreamweaver-side, the answer could sound the opposite.

Yep - same here. 12 years ago, I decided against DW - but for very different reasons.

What I like is, that you try to learn the underlying language(s) - that’s cool. And you know what? The less you base your learning curve on an app or framework(thinking), the more open-minded you’re afterwards.

Cheers

Thomas

6

While I can’t saying anything about the program (Dreamweaver), I don’t like Adobe much as a company anymore. They started out as the underdog, competing against Quark and Macromedia, and were very loyal to their users. Now that they’re a big corporate success, it’s all about the :moneybag: and their shareholders. They have no qualms about pulling the rug out from under their customers by suddenly dropping software that hundreds of thousands of people depend on to make a living, and their Creative Cloud based model is just obnoxious. The software is massively bloated, chews up tons of system resources, and is constantly phoning home to Adobe. I won’t even get into Flash :confounded:.

1 Like