[fullscreen theme] having problems removing space between horizontal images

  • bagx3

    (@bagx3)


    11 years, 6 months 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

Viewing 15 replies - 1 through 15 (of 16 total)
1 2
  • neo

    (@bossmeow)

    11 years, 6 months 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. 🙂

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months 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 ?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 6 months ago

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

    neo

    (@bossmeow)

    11 years, 6 months 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

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months 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

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months 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?

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months ago

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

    neo

    (@bossmeow)

    11 years, 6 months 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. 🙂

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months ago

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

    thats the one i have.

    ill search for another

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 6 months 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.

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months 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,

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months ago

    thanks have downloaded the CSS plugin,

    where would i go from here,

    thanks for your help guys appreicate it

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 6 months 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;
}

    neo

    (@bossmeow)

    11 years, 6 months 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.

    Thread Starter bagx3

    (@bagx3)

    11 years, 6 months 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

Viewing 15 replies - 1 through 15 (of 16 total)
1 2
  • The topic ‘[fullscreen theme] having problems removing space between horizontal images’ is closed to new replies.