Hello all I am new to the community here and I hope to help others as others help me.
Here is my problem. I am trying to create a website using CSS, JQuery, HTML and some php later (still not sure weather I want the PHP)
So the problem is that it appears that the CSS sheet is not linking to the HTML sheet. (page/s)
Bellow are both codes in order CSS first and followed by HTML.
CSS:
Code:
.body{
background url:(images/bodybg.jpg)
}
#slider_wrapper {
height: 246px;
}
#slider {
position: relative;
width: 1000;
height: 350;
}
#slider img {
position: absolute;
top:
left: 0;
display: none;
background: url(images/loading.gif) no-repeat 50% 50%;
}
#slider a {
border: 0;
display: block;
}
/*
* jQuery Nivo Slider v3.1
* http://nivo.dev7studios.com
*
* Copyright 2012, Dev7studios
* Free to use and abuse under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
/* The Nivo Slider styles */
.nivoSlider {
position:relative;
width:100%;
height:auto;
overflow: hidden;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
max-width: none;
}
.nivo-main-image {
display: block !important;
position: relative !important;
width: 100% !important;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:6;
display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:5;
height:100%;
top:0;
}
.nivo-box {
display:block;
position:absolute;
z-index:5;
overflow:hidden;
}
.nivo-box img { display:block; }
/* Caption styles */
.nivo-caption {
position:absolute;
left:0px;
bottom:0px;
background:#000;
color:#fff;
width:100%;
z-index:8;
padding: 5px 10px;
opacity: 0.8;
overflow: hidden;
display: none;
-moz-opacity: 0.8;
filter:alpha(opacity=8);
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box; /* Firefox, other Gecko */
box-sizing: border-box; /* Opera/IE 8+ */
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-caption a {
display:inline !important;
}
.nivo-html-caption {
display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
position:absolute;
top:45%;
z-index:9;
cursor:pointer;
}
.nivo-prevNav {
left:0px;
}
.nivo-nextNav {
right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
text-align:center;
padding: 15px 0;
}
.nivo-controlNav a {
cursor:pointer;
}
.nivo-controlNav a.active {
font-weight:bold;
}
*{
margin: 0;
}
html, body{
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em;
}
.footer, .push {
height: 4em;
color: #FFFFFF;
text-align: center;
}
HTML:
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
<script src="jquery-1.7.1.min.js " type="text/javascript"></script>
<script src="jquery.nivo.slider.js " type="text/javascript"></script>
<title>Shutter Speed Artography</title>
</head>
<body id="body">
<div class="wrapper">
<div id="slider-wrapper">
<div is="slider">
<img src="images/Abstract 73.jpg" title="Abstract image 73" height="350" width="1000">
<img src="images/beetle 3.jpg" title="#htmlcaption" height="350" width="1000">
</div>
<div id="htmlcaption" class="nivo-slider-caption">
</div>
<strong>image</strong> <a href="#">tag</a>
</div>
</div>
<h1 id="main_heading">Shutter Speed Artography</h1>
<br />
<br />
<br />
<div id="upper-content">
<div id="p-home">
<p>
Welcome to the home of Shutter Speed Artography
</p>
</div>
</div>
</div>
<div class="footer">
<p>
Copyright © 2012 Shutter Speed Artography
</p>
<p>
<a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>
</p>
</div>
</body>
</html>
So there are the 2 codes.
I would be most grateful if somone could assist me with this issue.
Thanks
Nick