HTML Footer - Can`t put it after a body with image - html

I`m doing a (very) simple website for college but I got stuck. The idea is just have an image as body and an Iframe on header (we are not using html 5). It will have first, info and contact page that are gonna use the same header and footer
Until now I did it fine, things are working well with the header but I'm not getting to add the footer after the image, the content is always doing in the middle of the photo, I`m trying it in many different ways.
PS: Each page has a different photo with the same size in the body background.
The footer must be placed immediately after the image, with the same width (912px).
Thank you!

Related

FOOTER-COUNT-PAGES-CSS

I'm currently working on a project, I m generate a html with many tables, then I successfully introduced the footer and header to keep them in all printed pages, but i wish put in the footer how many pages I already have without JS.
But I don't know how I can do this.
I tried to put css with counter(pages) directly in the fixed footer, but the css work just for the first page, after that it disappears.
I tried to put a div with css counter and a relative position in the footer which has fixed position, but it worked just for the first page.

Exchanging header and footer in html doc

I am new to web development and one question I was asked in interview that
In html page what will happen if we define header at bottom and footer at top. Will they exchange their position or not? I tried searching it but didn't got any better explanation. Please help.
In HTML, it all depends on where you define the tags. What I mean by this is that the display will follow the structure of your HTML code. For example, if you define your header at the bottom and the footer at the top, the display will follow your structure and you will see your header at the bottom and the footer at the top.

How to set a different main content background for each page in weebly?

I have a Weebly website, and the default Weebly css and html code only uses one main content background (the background that fits the drag and drop area) for all pages on the website. I know how to customize this, however I dont know how to create more/different main content backgrounds and use each for a specific page. I suspect I need a script, or maybe enter a specific code in the header of each page, but I dont know.
Alternative options like inserting the background in the header code itself will not work, as this will not fit when resizing the browser window.
Help is much appreciated :)
Each page on Weebly has a wsite-page-... class on it. For example, take this website which is made in Weebly. The background is on the #wrapper div element, but the body tag on this page has a wsite-page-my-story class on it. This class is unique for this page. Therefore, I can apply CSS to the #wrapper id by identifying it through the body's class like so:
.wsite-page-my-story > #wrapper {background:red;}
This will make the background on that specific Weebly page bright red. This can of course be replaced with anything else.

Multiple background images for Header,Body, Footer

I am trying to add the following image as background to the content of a website:
http://webbos.co/vibration/wp-content/themes/vibration-child-theme/images/back1.jpg
http://webbos.co/vibration/
I would like the header part to stay the same size on all pages, the same goes for the footer.
But as the body changes from page to page, i would like it to change accordingly but still fit properly to the header and footer part of the whole image.
I tried different techniques to implement this solution, but couldn't figure it out.
The issue is that the body part of the image doesnt repeat-y so well, as it changes throughout the height of the image,
I would appreciate a solution, and it doesnt matter for me if i have to cut the images to 2 or 3 parts.
Thank you
if you are doing it in php den create different header.php and footer.php and with the background you want and use this code for each page.
<body>
<?php include 'header.php';?>
<your middle content>
<?php include 'footer.php';?>
</body>
follow this code for each page...
for header and footer background css you may have to use background-repeat:no-repeat
and for body background-repeat:x or y

Extend Div to bottom of page, starting from absolute position

First, I'd like to say that I have no experience with HTML or CSS so bear with me here.
I'm trying to have a Logo, content, then footer. The Logo has a background that overlaps with content, and footer has a background that overlaps with footer aswell.
This pic might explain better: http://picpaste.com/help-vXUqWlZ8.png
HTML Code: http://pastebin.com/0ZWCB9jU
CSS Code: /w7Ugu78Z <-- also pastebin, but I can't post entire link due to spam prevention.
The problem is that, there's an extra space at the bottom of the page that I can't remove.
Would really appreciate any help.. I tried googling but the solutions I found I failed to get it to work.
Best Regards,
Essam.
It seems you want the footer to remain at the bottom of the page.
I think this is what you're looking for: http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page