Solved

Header image for WordPress Not Responsive

Posted on 2016-09-17
6
57 Views
Last Modified: 2016-09-18
I am having trouble getting the header for my WordPress site to be responsive.

http://www.domgarofalo.com/bjj/

Right now, I just have it set to disappear, but I would like it to shrink with the
window size.

Please help. Thank you.
0
Comment
Question by:dgarofalo
  • 3
  • 2
6 Comments
 
LVL 18

Expert Comment

by:Steven Harris
ID: 41803237
This expert suggested creating a Gigs project.
This will be depend on your installed theme, or plugin that is being used. Can you give some more details on how you are trying to accomplish this? What steps are you taking? Can you provide any screenshots?
0
 

Author Comment

by:dgarofalo
ID: 41803410
The only thing I have done is make the header disappear. I have not used a plugin or anything like that.
0
 
LVL 28

Accepted Solution

by:
chilternPC earned 500 total points
ID: 41803539
I would remove the  style code that you have that makes it disappear

section.logo-box {
    margin-left: -9999px;
}

Open in new window


and change the following styles in style.css

currently it is:
section.logo-box {
    float: left;
    width: 67.25%;
    margin-top: 0.5em;
}

Open in new window


change it to:

section.logo-box {
    float: left;
    width: 100%;
    margin-top: 0.5em;
}

Open in new window



and change

#title {
    width: 1100px;
}

Open in new window


to:

#title {
    width: 100%;
}

Open in new window


then you need to redesign your header image to be at least 1100px wide as the current image is only 556px wide
0
Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 28

Expert Comment

by:chilternPC
ID: 41803541
you'll also have to adjust all the margins etc... in the media queries to get ride of the white space
0
 
LVL 28

Expert Comment

by:chilternPC
ID: 41803542
to do this without messing with the theme,
 install a plugin called "simply custom CSS"

which is here : https://en-gb.wordpress.org/plugins/simple-custom-css/
then under appearance you get a "custom css"

then add the changes to the styles   in this bit.

otherwise if its a bought them you may lose your changes when you get updates.
0
 

Author Closing Comment

by:dgarofalo
ID: 41804215
Thank you, worked great!
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

In order to have all security and back ups taken care of, WordPress users can sign up for services with WP Engine.
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
The purpose of this video is to demonstrate how to set up basic WordPress SEO. This will be demonstrated using a Windows 8 PC. The plugin used will be WordPress SEO by Yoast. Go to your WordPress login page. This will look like the following: myw…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question