- This topic is empty.
-
AuthorPosts
-
February 9, 2015 at 3:18 pm #195410paigeweberParticipant
Hello!
I can’t figure out some of the CSS I need for my website, http://orthopaedicandsportsclinic.weebly.com/
There are four things I need to do:
1. Get rid of the white space at the very top.
2. There are two little white lines in my blue box.. need to get rid of those. Can’t even figure out what they are.
3. Get rid of the white space between the slide show and blue bar.
4. Stretch the slideshow across the width of the page.Any help is appreciated. And let me know if there is anything else I should provide. Thanks so much!
February 9, 2015 at 3:58 pm #195418Paulie_DMemberGet rid of the white space at the very top.
Not sure if any of this is even possible in Weebly but here goes.
The white space has two parts.
Firstly.
#page-wrap { background: url(theme/body-bg.jpg?1423522112) repeat; border-top: none; border-bottom: none; padding: 27px 0px 20px 0px; }
The 27px to top padding should be removed.
Secondly,
There’s a
table
…an empty one.<table id="header"> <tbody><tr> <td class="phone-number"></td> <td id="header-right"> <table> <tbody><tr> <td class="social"></td> <td class="search"></td> </tr> </tbody></table> </td> </tr> </tbody></table>
in your
.container
div.If it’s empty, remove it and the remaining space disappears.
February 9, 2015 at 4:06 pm #195419Paulie_DMemberThere are two little white lines in my blue box.. need to get rid of those. Can’t even figure out what they are.
Looks like it’s the background image…here…try removing that.
#nav-wrap .container { clear: both; overflow: hidden; position: relative; padding-bottom: 35px; margin-bottom: 40px; background: url(theme/saperator.png?1423522112) no-repeat bottom left; }
Just notice there’s a shipload of tables being used for layout…is that your coding or Weebly?
Either way…it’s not 1999 anymore…we don’t use tables for layout.
Moving on….
February 9, 2015 at 4:16 pm #195420Paulie_DMemberGet rid of the white space between the slide show and blue bar.
This one is going to take a while….there’s a lot of stuff you are going to have to change and I’m doubtful if this is actually something that Weebly will let you do since it seems to be integral the actual slider.
If this a template or something? Could you pick another?
February 9, 2015 at 11:41 pm #195434paigeweberParticipantThank you for the replies! When I tried this:
#page-wrap {
background: url(theme/body-bg.jpg?1423522112) repeat;
border-top: none;
border-bottom: none;
padding: 27px 0px 20px 0px;
}the white lines blinked after I refreshed the page, but stayed there nonetheless. Do you have any suggestions?
February 9, 2015 at 11:41 pm #195435paigeweberParticipantAlso — it’s Weebly’s coding, not mine. But I agree haha
February 9, 2015 at 11:47 pm #195436paigeweberParticipantAwesome! Weebly won’t let me see all of the HTML for some reason, but I could get to the table part and delete it. Huge help. Thanks.
February 10, 2015 at 2:34 am #195441paigeweberParticipantUpdate: I got rid of the white space at the top and on the sides of the slideshow, but I’m still working on the white space between the blue section and slideshow.
Also — is there a way I can make the footer responsive to the width of the page? Like right now on the home page, I want it to be further up (where the slideshow ends), but I don’t want that to affect the other pages.
Thanks!
February 10, 2015 at 4:51 am #195447Paulie_DMemberWeebly won’t let me see all of the HTML for some reason
You can inspect it using Developer Tools (hit F12) in your browser.
This will allow you to see what HTML & CSS is affecting the site (it’s what I did).
February 10, 2015 at 4:53 am #195448Paulie_DMemberOne thing…this
#main-wrap .container { min-height: 400px; /* this */ }
If you turn that off…you lose a lot of whitespace from the site.
February 10, 2015 at 4:56 am #195453Paulie_DMemberis there a way I can make the footer responsive to the width of the page?
It is responsive to the width of the page…it’s a div that is 100% wide automatically.
Frankly, the ‘internal’ div shouldn’t have bare text in it…that text should be wrapped in a text element (probably a
p
tag in this case)<div id="footer-wrap"> <div class="container"> © 2015 Orthopaedic & Sports Clinic |1014 W. St. Clare Blvd. | Suite 1020 | Gonzales, LA 70737 </div> </div>
February 10, 2015 at 5:01 am #195454Paulie_DMemberI’m still working on the white space between the blue section and slideshow.
It’s the bottom margin – see below
Line 12
#nav-wrap .container { margin-right: 50px; clear: both; overflow: hidden; position: relative; padding-bottom: 35px; margin-bottom: 45px; /* remove this */ background: url(theme/theme/saperator.png?1423522112?1423563721) no-repeat bottom left; }
However, that’s only part of it as you seem to have the same selector twice in the CSS although some of the declarations are different.
Line 67
#nav-wrap .container { clear: both; overflow: hidden; position: relative; padding-bottom: 35px; margin-bottom: 40px; background: url(theme/saperator.png?1423563721) no-repeat bottom left; }
February 10, 2015 at 5:33 am #195459ShikkedielParticipantHey, those HTML/CSS boxes look nice. Don’t mind me party crashing the topic for it. How did you manage to create them, @Paulie_D?
February 10, 2015 at 5:36 am #195460Paulie_DMemberChris Coyier mentioned it in the forum revamp thread
In some flavors of Markdown, you can do like [triple tick]css at the start of a block to indicate the language,
So
something
something
something
JS doesn’t work…the site throws a security warning.
February 10, 2015 at 6:35 am #195468ShikkedielParticipantOkay, thanks. That’ll be handy. I must have seen but not really read it…
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.