A few questions. some help would be awesome

ikillbears

ikillbears

ikillbears

Soldato
Joined
5 Feb 2006
Posts
3,524
Hey guys,

a wee smidge of help here would be awesome. I'm making a site for my mum as shes trying to get some charity thing together. no problem i thought. ill give a hand as i've slowly been getting better at making websites. But i've hit some road blocks.

question 1.) http://i.imgur.com/igEUg.jpg as you can see i designed it with a background picture. every one has bought into this idea. but i have now realised that with added news content the bottom of the main div will extend and cause the picture to overlap .... :(. is there a way i can some how make it all display in it and scroll ?

question 2.) bit related to the above. i plan on making this into a wordpress so that she can update it with out me. i read that its best to start from a static html page which is what im creating now. baring in mind the above is that going to be possible.

question 3.) thirdly :) i'm having a run through of the 1140 grid system found here http://http://cssgrid.net/ . one thing, i've tried to put padding on my main news section but it throws it all out of kilter. surely padding just affects in innards of a div ?

cheers guys. :)
 
Last edited:
1. use the background-attachment css property
2. you can create a static page and then rip out the different elements to fit into a word press theme, shouldn't be a problem providing you structure it in a template friendly way (header, footer, main page content, etc).
3.padding adds width and height to an element, for example if you add padding-right: 10px you will need to remove 10px from the width of the element, margins do not do this.
 
1. surely that means that say i make it into a wordpress compatible site then if more news is added and the white box extends down then what happens ? doesn't it just leave the background body colour. What would be great is if theres some way i could have stuff in the white scroll ?

2. ok cool. hopefully ill work out how to do this.

3. i was under the impression that padding pushes into the div where as margin pushes out of the div. like this

Ds0Nl.jpg
 
Modern w3c compliant browsers will take the width you specify for a div and apply that to the content, and then add the width of any padding and borders onto the specified width i.e.:

div{
width:100px;
padding:10px;
border:10px solid black;
}

will render as 10px + 10px + 100px + 10px +10px = 140px wide

You can however change this behaviour by using the box-sizing CSS property. The above
is equivalent to box-sizing:content-box, but you can use box-sizing:border-box, which would render the above div as 100px, with 60px available within the div for content.

http://www.quirksmode.org/css/box.html
 
this is the problem for which i am foreseeing. http://imgur.com/yK2YU

if i make this into a wordpress blog ( which is my aim ) the white bit with the text will grow in length. eventually it will go over the background picture and into the white section. it did repeat, i presume tile, but i added the code suggested above which ill paste.

Code: 
body {
	background-image: url(../assests/bkg.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;

so the real question is. can i create something, an iFrame ??? so that it scrolls in the white area and doesnt ever spread over the background picture ? :)

edit : the problem isnt the fact that the image does that. i know it will. the problem i want to solve is to put all my information in my main white box :)
 
Last edited:
You must log in or register to reply here.
Back
Top Bottom