Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] Resetting the left margin

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #166674
    tnesler
    Participant

    Hello!

    I am working with Chris Coyler’s slider code and I have everything working just the way I want it except…I can’t reset the left margin after the slider section.

    Here is the #page-wrap div commands:

    #page-wrap { width: 300px; margin: 25px auto; position: relative; min-height: 100px; }

    Here is my footer div commands which is supposed to put the footer beneath the Slider section all the way to the left margin:

    #footer {width:900px; position: static; margin: 10px; text-align:left; }

    Since this is a test page, I don’t have any other divs except the ones Chris Coyle set up for the Slider itself which is inside the page-wrap div.

    Thanks for your help!
    Tom Nesler

    #166676
    Paulie_D
    Member

    A link to a Codepen.io test case or a live page would be helpful.

    #166768
    tnesler
    Participant

    Thanks for the quick response. I was able to put my code into Codepen:

    http://codepen.io/TNesler/pen/hKGzp/

    I hope this will make it easier to determine what I am missing. The Slider component does not work because I did not place the JS there. But you can see that the bottom section is not moved over as I would like.

    #166779
    Paulie_D
    Member

    If you could link actual images or placeholders (perhaps from lorempixel.com) it would be useful.

    You can also link Jquery and an other scripts via the ‘cog’ icon and pasting the relevant link into the place provided.

    I would also mention that it looks like we aren’t necessarily getting all of the required classes/CSS.

    http://codepen.io/Paulie-D/pen/xvfFw

    As a final step you should also click on each ‘cog’ and hit the analyse button to spot an potential errors

    #166833
    tnesler
    Participant

    I used the Placeholder technique (Thanks Shaneisme) to replace my jpgs. I tried to fix the errors mentioned in the Analyze (Cog) routine.

    I am not sure how to get the JQuery modules into this system…:-( I recommend getting the Jquery modules from Chris Coyle’s original download:

    https://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/

    Please remember that the slider works fine, but my problem is trying to override the slider’s margins beneath the slider.

    Thanks for your patience!

    #166835
    Paulie_D
    Member

    I am not sure how to get the JQuery modules into this system…:-( I recommend getting the Jquery modules from Chris Coyle’s original download:

    I covered that here:

    You can also link Jquery and an other scripts via the ‘cog’ icon and pasting the relevant link into the place provided.

    This assumes that you have an actual link (CDN or other) to a live copy of the JS files. You should be able to google the relevant links.

    In any event, perhaps a ‘pared down’ Codepen without the slider because it’s still not clear to me what the issue actually is.

    You have a ‘page-wrap’ that’s only 300px wide….that’s a pretty small page, my friend.

    Just make Codepen with the basic elements and widths/margins…no need for the whole shebang.

    #166877
    tnesler
    Participant

    Thanks Paulie_D. I was able to figure out what I was doing wrong. It looks like in my attempts to make it useful for my application, I removed some ‘s from the bottom, which meant that the margin info from the ‘page-wrap’ div was being sent into my ‘footer’ div…:-(

    I am used to having my compiler warn me of dumb errors like that. HTML and CSS are much more forgiving and also unhelpful when it comes to fixing things like that.

    Thanks again for your efforts. Codepen is a good tool for sharing code and collaboration. I updated my code so it works correctly now.

Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘CSS’ is closed to new topics and replies.