1 Week
Discussion Span
Last Post by newbi11

So what do you expect us to be able to do? Any code available? Any markup and css? Screenshots? Our crystal balls are being polished...


Can I upload the files (html , css) here? It would be a mess copying and pasting all the codes here.


No, you can upload screenshots and paste code snippets. However, you could link to jsfiddles etc. We work best with code. Just paste the relevant stuff. 100's of lines of code with be ignored.


I figured out how to fix the issue on the first jsfiddle, only problem now is the alignment. Here's a screenshot:

The footer issue on the second fiddle still remains though.

Attachments screenshot.jpg 88.33 KB

Most of what you are asking for is down to the WP theme itself, possibly residing in style.css. Simply copying snippets of styling to jsfiddle may not be the whole code required for the final output in WP. WP themes can (but shouldn't!) have convoluted paths to css file, which aren't always obvious.

Anyhow not sure if your theme is using a front-end css grid system, but your second link appears to suggest that it does:


If similar to other systems, like Bootstrap, then you may be able to configure this nicely. Else you can give controls % widths (33% or less in this case - depending on the gaps required).

However, if you're not working with a grid system, you'll see the controls getting ridiculously small as you make the screen smaller. Grid systems allow you to set up different column sizes at certain "breakpoints". You can do the same without a grid system. Additionally / Alternatively you can set minimum / maximum widths for your controls, which may give you a more fluid rather than responsive feature.

So before going further, do you use a grid system - and if so what is it?
What sort of feature are you looking for - static, fluid or responsive (or something else)?

PS - not sure what you mean about height of footer, maybe this:

footer {
    padding:70px 0;

That gives a 70px gap above and below the footer content. You also have a containing section that also has this:

section {
    padding:70px 0;
    background-color: #c0392b;

So effectively, you have 140px above and below the footer content.


I managed to reduce the padding but the footer still covers a lot of space. I have included the bootstrap.min.css code in the jsfiddle I uploaded earlier on here - http://jsfiddle.net/6ky3dw6s/ . I really hope someone can help me out here. I just need to reduce the footer before I check form functionality.

Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.