responsive tagline

  • Resolved orartspace

    (@orartspace)


    5 years ago

    Hello,
    I am using Gutenshop theme. The tagline is too short. I want to make the width longer. So i used css:

    .site-description { width: 400% }

    This looks nicer on desktop, but on mobile phone, the text extends out of the screen. This was expected but I don’t know how to make it both longer on the desktop than it originally is and responsive for smaller screens

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Jarret

    (@jarretc)

    Hello, you would wrap your code inside of a CSS media query, so it would look something like the following

    @media screen and (min-width: 768px) {
	.site-description {
		width: 400%;
	}
}

    The above code says, if the browser width is larger than 768px wide, then set the .site-description class to 400%. You can adjust the 768px value to your liking but that is usually a common breakpoint.

    Theme Author Superb

    (@themeeverest)

    Thanks for helping him Jarret, I’m marking this as done ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘responsive tagline’ is closed to new replies.