CSS interactive tutorial

Responsive Breakpoints

Live CSS

Desktop: Main content grows; widget and statistics share one row.

824px
Desktop824px
Header
Main
Statistics
Footer
layout.css
Base≥ 480px≥ 768px≥ 1024px
/* Desktop · 768-1023px */@media (min-width: 768px) {  .layout {    grid-template-columns: 11rem 1fr 1fr;    grid-template-rows: auto 1fr auto auto;    grid-template-areas:      "header header header"      "sidebar main main"      "sidebar widget statistics"      "footer footer footer";  }}

Get a fixed quote

Tap what sounds like you. We reply with a price and a timeline in writing.

What's slowing you down?
What should it include?

Pick at least one thing above, or write a line.

Usually within 24 hours. No commitment, nothing starts until you say yes.

Try your own assistant

Name it, pick how it talks, then send it a message. A scripted example of a real chat.

How it talks
Where it lives
Musashibot
Today

Tap a button on the keyboard below, or type your own message.

Musashi is ours. Give yours a name above and it's set up for you, with the personality you pick.

Get my ownCompare plans

From $299 setup and $29/month. Messages marked Pro need the Pro plan.