WordPress.org

Ready to get started?Download WordPress

Forums

[fullscreen theme] having problems removing space between horizontal images (17 posts)

  1. bagx3
    Member
    Posted 1 year ago #

    i have use two seperate images of a UK map (top scotland bottom england) in order to click one or the other to be directed to the correct page, this was instead of creating an imagemap

    however i have done it but its leaving a nasty gap between the pictures,

    site is exceltrading.co.uk/contactus/

    theme: fullscreen template

    i beleive it can be done with CSS but i dont have a custom CSS field on this theme, tried everything for 3 hours now

  2. neo
    Member
    Posted 1 year ago #

    First you have to remove margin-bottom:20px; at screen.css (line 212)

    .box-center img {
        margin-bottom: 20px;
    }

    Then change margin:auto auto 15px; to margin:auto; at screen.css (line 48)

    .aligncenter {
        display: block !important;
        margin: auto auto 15px;
        text-align: center;
    }

    Based on a quick edit using Firebug, it works.

    Good Luck. :)

  3. bagx3
    Member
    Posted 1 year ago #

    thanks very much for your reply,

    i know whta you mean i.e the code part.

    who would i edit screen.css? i.e line 212 & 48

    i dont see scree.ncss in my desh board? is it via FTP ?

  4. Andrew Nevins
    Volunteer Moderator
    Posted 1 year ago #

    Does your theme come with a section in the dashboard named, "Custom CSS"?

  5. neo
    Member
    Posted 1 year ago #

    You can edit via FTP which it should be at the path below

    /public_html/wp-content/themes/your-themes/

    Or you can edit from your WordPress Panel

    WordPress Dashboard > Appearance > Editor

    Then look for a file at your right hand corner for file screen.css

  6. bagx3
    Member
    Posted 1 year ago #

    thanks for your help again, havent got screen.css in dashboard downloaded it from ftp and have uploaded to a php code editor online,

    i can find the things you are referring to in these, ie line 212 and 48 doesnt say what yours does above. :(

    also no there is no custom css

    thanks

  7. bagx3
    Member
    Posted 1 year ago #

    i found this on line 423?

    .box-center img {/*max-width: 100%; max-width: 397px/;*/ margin-bottom: 20px; }

    is this the man for the job?

  8. bagx3
    Member
    Posted 1 year ago #

    ive serchd the whole doc and cant find the line 48 sequece your referring too :( :l

  9. neo
    Member
    Posted 1 year ago #

    I checked using Firebug and can see that the CSS is still there. Just check if you have edit the correct file cause some themes come with a multiple same css files. :)

  10. bagx3
    Member
    Posted 1 year ago #

    /wp-content/themes/fullscreen/css/screen.css ?

    thats the one i have.

    ill search for another

  11. Andrew Nevins
    Volunteer Moderator
    Posted 1 year ago #

    If you use a CSS Manager plugin, you're given an area to enter CSS and you need not edit the theme's files.

  12. bagx3
    Member
    Posted 1 year ago #

    ran a search. ^^ thats the only screen.css on the server

    im happy to give you access if im doing something wrong here dont want to waste your time,

  13. bagx3
    Member
    Posted 1 year ago #

    thanks have downloaded the CSS plugin,

    where would i go from here,

    thanks for your help guys appreicate it

  14. Andrew Nevins
    Volunteer Moderator
    Posted 1 year ago #

    Using Neo's recommendations;

    First you have to remove margin-bottom:20px; at screen.css (line 212)

    .box-center img {
        margin-bottom: 20px;
    }

    Then change margin:auto auto 15px; to margin:auto; at screen.css (line 48)

    .aligncenter {
        display: block !important;
        margin: auto auto 15px;
        text-align: center;
    }

    Try adding this;

    .box-center img {
        margin-bottom: 0;
    }
    
    .aligncenter {
        margin: auto;
    }
  15. neo
    Member
    Posted 1 year ago #

    You can email me a FTP temporary access and I can have a look for you.

    Do change the access after I take a look.

  16. bagx3
    Member
    Posted 1 year ago #

    hi andrew,

    i cant find the content on those lines, been through the files and search, only have one screen.css and its not displaying these things.

    i added
    .box-center img {
    margin-bottom: 0;
    }

    .aligncenter {
    display: block !important;
    margin: auto;
    text-align: center;
    }

    to the custom CSS but no luck so im guessing i need to find these things above,

    ive tried cntrl+F and line numbers to no avail

  17. bagx3
    Member
    Posted 1 year ago #

    ok neo. i will do,

    thanks andrew for your help aswell

Topic Closed

This topic has been closed to new replies.

About this Topic