- This topic is empty.
-
AuthorPosts
-
January 24, 2014 at 4:28 am #161067spacemonkey1112Participant
on my website (www.stewartuy.com) you will see a rotating banner & huge amount of space between it and my logo on the left sidebar. I am not 100% sure how to fix the .css but this is what I found on the wordpress template.
/*
anythingSlider v1.2By Chris Coyier: https://css-tricks.com with major improvements by Doug Neiner: http://pixelgraphics.us/ based on work by Remy Sharp: http://jqueryfordesigners.com/
*/
.anythingSlider { width: 740px; height: 200px; Position: relative; padding-bottom: 20px; margin-left: 230px; }
.anythingSlider .wrapper { width: 740px; overflow: auto; height: 200px; margin: 0px; position: relative; top: 0; left: 0; margin-left: 230px; }/* Width below is max for Opera */
.anythingSlider .wrapper ul { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; background: #eee; margin: 0; margin-left: 230px; }
.anythingSlider ul li { display: block; float: left; padding: 0; height: 320px; width: 1000px; margin: 0; position: relative; left: -40px; margin-left: 230px; }What must I change in order for me to align the rotating banner with my wide column content? Thanks!
January 24, 2014 at 5:15 am #161070Paulie_DMemberLink or working Codepen please.
January 24, 2014 at 7:12 am #161071Gary PicklesParticipantspacemonkey1112, just had a look, Looks fine to me, on PC running Chrome.
What i would say is, that it took a long time for the page to load with the amount of images, could do with looking at some way of speeding this up.January 24, 2014 at 8:22 am #161073Paulie_DMemberJust found the link (was that there earlier?).
just had a look, Looks fine to me, on PC running Chrome.
Ditto.
Is this an issue in a specific browser?
Some of the HTML seems little “funky”…you have lots of things in
<p>
tags where I would expect to seediv
s but “if it works, it works!”That said, your main page is waaaaay long, I scrolled down for a really long time.
You really should look to move all those extra posts to a separate section.
January 28, 2014 at 2:36 am #161264spacemonkey1112ParticipantThank you everyone for your reply, I spent a few hours on this & some how I found this when playing around with inspecting the elements through my chrome browser.
.anythingSlider { width: 740px; height: 200px; Position: relative; padding-bottom: 20px; margin-left: 230px; }
.anythingSlider .wrapper { width: 740px; overflow: auto; height: 200px; margin: 0; position: absolute; top: 0; left: 0; }
.anythingSlider .wrapper ul { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; background: #eee; margin: 0; }
.anythingSlider ul li { display: block; float: left; padding: 0; height: 320px; width: 1000px; margin: 0; position: relative; left: -40px;
I’ve cut and pasted this into my CSS editor in wordpress. According to wordpress, anything that I put in this editor will override whatever is currently written the css of the wordpress theme.
If I remove this coding, the banner will move back over to the right side and the gap will reappear.
As for the scroll fatigue, thank you for the feedback. Do you suggest I allow the page to load 1 or 2 blog post per page? (currently it is loading 3).
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.