This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Customizing CSS for mobile

  • Creator
    Topic
  • #6447
    reekes
    Participant

    Thanks to your nice framework I’ve got my child’s custom.css working well (for the desktop case).

    How can I make some tweaks to the mobile style? For example, increase the font size, adjust the menus, etc.?

    I was about to copy the responsive.css into my custom.css, and start hacking away but I thought I should ask first 😉

Viewing 3 replies - 1 through 3 (of 3 total)
  • Author
    Replies
  • #6460
    Jason Bobich
    Keymaster

    Hello,

    The theme uses CSS @media queries to target different device viewport, which is currently a really common approach to responsive web design. So, do definitely take a look at responsive.css and see what’s going on there, but there’s no reason to just copy the whole thing.

    You can setup your custom.css something like this:

    /* Your styles for desktop ... */
    .whatever {
    	...
    }
    .whatever-else {
    	...
    }
    
    @media (max-width: 800px) {	
    	/* Your styles for tablets ... */
    	.whatever {
    		...
    	}
    	.whatever-else {
    		...
    	}
    }
    
    @media (max-width: 480px) {	
    	/* Your styles for mobile ... */
    	.whatever {
    		...
    	}
    	.whatever-else {
    		...
    	}
    }
    #6462
    reekes
    Participant

    I guess my real question was if I can just add this scaffolding and only add the specific classes I want to over-ride.

    I think the answer is yes, and it’s an easy thing for me to verify.

    I just wanted to check that this is the right approach, and to add this into my custom.css file. I think you answer it 😉

    #6467
    Jason Bobich
    Keymaster

    Yup, you only need to add what you want to override.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The forum ‘The Arcadian Responsive WordPress Theme’ is closed to new topics and replies.