how to ensure responsiveness in wp themes?

Closed. This question is off-topic. It is not currently accepting answers.

---

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 6 years ago.

Improve this question

I'm creating my custom theme from a static page I created. CSS seems to work on a static page but when I tried to convert it into a wp theme, it didn't work. I suspected it was because of how I enqueue css and js.

function wpdocs_abrett_scripts() {       
    wp_enqueue_style( 'main-style', get_stylesheet_uri());
    wp_enqueue_style( 'abrett2',  get_template_directory_uri() .'/dist/fullpage.css', array(), null, 'all' );
    wp_enqueue_style( 'abrett3',  get_template_directory_uri() .'/examples.css', array(), null, 'all' );
    wp_enqueue_style( 'abrett1',  get_template_directory_uri() .'/css/abrett.css', array(), null, 'all' );    
    wp_deregister_script('jquery');
    wp_enqueue_script('jquery', '.8.3/jquery.min.js', array(), null, true);    
    wp_enqueue_script( 'fullpage', get_template_directory_uri() . '/dist/fullpage.js', array('jquery'), '1.0.0', true );    
    wp_enqueue_script( 'fullpagecustomscript', get_template_directory_uri() . '/examples.js', array('jquery','fullpage'), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'wpdocs_abrett_scripts' );

I'm wondering though that almost all styles worked except the image being responsive.

Here's the static page:

/

And here's the wp theme version.

/

If you try to change the window size, the static page seems to resize with the window but not the wp version. And if you try to inspect the styles and elements using developer options, they have identical css being loaded. So, my question is how to ensure that the css will work on both version especial on wp theme?

Closed. This question is off-topic. It is not currently accepting answers.

---

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 6 years ago.

Improve this question

I'm creating my custom theme from a static page I created. CSS seems to work on a static page but when I tried to convert it into a wp theme, it didn't work. I suspected it was because of how I enqueue css and js.

function wpdocs_abrett_scripts() {       
    wp_enqueue_style( 'main-style', get_stylesheet_uri());
    wp_enqueue_style( 'abrett2',  get_template_directory_uri() .'/dist/fullpage.css', array(), null, 'all' );
    wp_enqueue_style( 'abrett3',  get_template_directory_uri() .'/examples.css', array(), null, 'all' );
    wp_enqueue_style( 'abrett1',  get_template_directory_uri() .'/css/abrett.css', array(), null, 'all' );    
    wp_deregister_script('jquery');
    wp_enqueue_script('jquery', 'http://ajax.googleapis/ajax/libs/jquery/1.8.3/jquery.min.js', array(), null, true);    
    wp_enqueue_script( 'fullpage', get_template_directory_uri() . '/dist/fullpage.js', array('jquery'), '1.0.0', true );    
    wp_enqueue_script( 'fullpagecustomscript', get_template_directory_uri() . '/examples.js', array('jquery','fullpage'), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'wpdocs_abrett_scripts' );

I'm wondering though that almost all styles worked except the image being responsive.

Here's the static page:

http://eightelms.co.uk/stat/

And here's the wp theme version.

http://eightelms.co.uk/

If you try to change the window size, the static page seems to resize with the window but not the wp version. And if you try to inspect the styles and elements using developer options, they have identical css being loaded. So, my question is how to ensure that the css will work on both version especial on wp theme?

• theme-development
• themes

Share Improve this question asked Jan 26, 2019 at 11:01 silent_coder14silent_coder14 12355 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

In http://www.eightelms.co.uk/wp-content/themes/abrett/examples.css(12) remove:

min-width: 1167px;

in body class selector.