[Kenta]

Hi, I would like to modify the mobile css setting (responsive.css, right?).
My site (http://kenta-kiyomiya.com/)

I guess What I want to do doesn’t cause dramatic changes but just want to change the appearance from a mobile like iphone, such as content width (make the content wider to the full screen on both sides), line height (reduce the line heights between content sentences) and so on. In order for that to work, I think I need to modify the responsive.css.

I found the previous discussion about this (http://catchthemes.com/support-forum/topic/responsive-css-not-active-in-child-theme/ ), and got some clue.
Maybe, I need to add some codes to my child-function.php, and then do something more.

Can you tell me what code I should add in my child-function php, and then which part I should change to modify the responsive.css.

I hope you get what I want to explain.

Thank you

[Sakin]

@Kenta: If you just want to make small changes, then you can add your responsive style in “Appearance => Theme Options => Custom CSS” box. But if you want to totally change responsive.css then you need to dequeue parent style and add you child file.

So, if you want to edit it from your child theme then first, you need to create responsive.css and functions.php file in your child theme. If you download sample child theme from http://catchthemes.com/blog/create-child-theme-wordpress/, then you will get this. You just need to add responsive.css file.

Then, you need to add the following code in your functions.php file in your child theme

// Remove Parent theme responsive.css and adding new responsive.css in child theme 
function adventurous_child_enqueue_scripts() {
    wp_dequeue_style( 'adventurous-responsive' );
    wp_enqueue_style( 'adventurous-child-responsive', get_stylesheet_directory_uri() . '/responsive.css' );
}
add_action( 'wp_enqueue_scripts', 'adventurous_child_enqueue_scripts', 11 );

[Kenta]

Hi Sakin
Thank you very much for your quick reply.
If I’m able to change the mobile appearance from cusom css box, it’s better NOT to use child function php or responsive css because it seems too complicating for me to handle (CSS novice). I’d better study the child theme, though.

So, could you please tell me the css codes about how to change the line height of content’s sentences (to get sentences closer to each other) and content’s width (In the default setting, there is too much space on both sides when I browse my site from a mobile device (iphone).

Note that I want to apply the changes to only mobile appearances. How my site looks from a laptop/desktop is already fine.

Thanks

[Sakin]

@Kenta: You can change the line height in the following css:
#primary { line-height: 1.65; }

[Author]

Posts