A few CSS Questions

[goalieman34]

Hello everyone,
-I have a splash page and would like to make the red spacing around the image all the same width (10px ). Currently the spacing on the bottom is wider then the rest and the top a bit smaller then the sides.
Here is the page: http://petrowest.squarespace.com/

-Currently I have a 2 px red border around my page. I would like it to also wrap around the footer. If there is a way to get it to wrap around the whole page instead of two individual sections that would be great.
http://petrowest.squarespace.com/divisions/

Thanks for the continued help,
Chris

[joshuanhibbert]

Adjust the top padding of #contentWrapper to match the left and right padding. Then, to deal with the bottom, give the image vertical-align: top;.

In regards to the page border, you could quite easily remove the top/bottom border in between the content and the footer to simulate the border wrapping both (this would require you to also give the footer a border).

[goalieman34]

ok great , that sounds good I will get working on that here and see how things go. Is there anyway you could show me what the image vertical-align: top; should look like.

[joshuanhibbert]

I would do it like this:

#content img {

vertical-align: top;

}

On a different note, any particular reason why you are using a splash page?

[goalieman34]

Ok thanks. Well I tried talking the client out of having a splash page but they are still stuck on having one. I am not sure what else I can mention to them to maybe change their minds.

[goalieman34]

Can anyone see what is making my footer not line up with my page content on the right hand side.
http://petrowest.squarespace.com/divisions/

[TheDoc]

Your footer wrapper has a width of 960 plus 2px border which gives it a total width of 964px.

[Paulie_D]

foo {

-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */

-moz-box-sizing: border-box;    /* Firefox, other Gecko */

box-sizing: border-box;         /* Opera/IE 8+ */

}

FTW

https://css-tricks.com/box-sizing/

[goalieman34]

Ok so all my borders are done. I just have one little issue. When I view it in IE the botter footer border doesnt line up on the sides. looks like it is off by a px or so. Isthis what is causing the problem?
http://petrowest.squarespace.com/home/

[dfogge]

ive used this* ancient (2001) article by INC mag to successfully talk clients out of using splash pages (and many other horrible ideas) before…and i’ll do it again!

* http://www.inc.com/articles/2001/06/23069.html

[Author]

Posts