severed arow Posted January 28, 2012 Author Posted January 28, 2012 Ikz and cholesterol post sometimes. Robin and dan are basically gone. dan posts very rarely, robin hasn't posted in forever. Ah, shame. Anyhow I'll fix the highlights now and them begin slicing and coding :) I'll post the finished static website when it's done.
Jonny Posted January 28, 2012 Posted January 28, 2012 cool idea, sorry I dont know enough about this topic to give you any kind of suggestion :s.
severed arow Posted January 28, 2012 Author Posted January 28, 2012 Ok here's the thing coded in it's static form, theres one thign though... The shadow at the top... I'm not sure how to fix it, does anyone know how to start a background image a specified amount of pixels away fro mthe top of the page? http://relent.dyndns.org/sharks/index.php <--- you can only see this when my computer is on.
I C0NN0R I Posted January 29, 2012 Posted January 29, 2012 Ok here's the thing coded in it's static form, theres one thign though... The shadow at the top... I'm not sure how to fix it, does anyone know how to start a background image a specified amount of pixels away fro mthe top of the page? http://relent.dyndns.org/sharks/index.php <--- you can only see this when my computer is on. Looks so much better :nice: I havn't done any html in ages, but i'm pretty sure you can add like {margin:0; padding:0;} to pretty much anything, one of which is like a border that'll push it down. I'm also sure there's a way you can just set co-ords. Like i said i havn't done html in ages but when i was doing some i pretty much put everything inside a hierarchy of containers and just floated shit so it can scale to fit dif screens.
severed arow Posted January 29, 2012 Author Posted January 29, 2012 Ok here's the thing coded in it's static form, theres one thign though... The shadow at the top... I'm not sure how to fix it, does anyone know how to start a background image a specified amount of pixels away fro mthe top of the page? http://relent.dyndns.org/sharks/index.php <--- you can only see this when my computer is on. Looks so much better :nice: I havn't done any html in ages, but i'm pretty sure you can add like {margin:0; padding:0;} to pretty much anything, one of which is like a border that'll push it down. I'm also sure there's a way you can just set co-ords. Like i said i havn't done html in ages but when i was doing some i pretty much put everything inside a hierarchy of containers and just floated shit so it can scale to fit dif screens. Well yes I certainly have a hierarchy of containers, unfortunately that means if i paf or margin the shdaow it pushed EVERYTHING down, as for typing in where the background image should start... that works but not when its repeating on the y axis, you see that shadow is really like 1 pixel high or something small, and repeated down the page so that it can easily be the size of the content. Oh and glad it looks better :). This is how i have my "hierarchy of containers" set up. This is the header: <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="Kamisoyokaze" /> <title>Beware of Sharks</title> <link href="headerstyle.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="shadow"> <div class="container"> <div id="head"><h1>Beware of Sharks!</h1></div><!--end head--> <div id="nav1"> <ul id="navlist"> <li class="nav1link"><a href="?page=home">Home</a></li> <li class="nav1_divider"><span></span></li> <li class="nav1link"><a href="?page=highscores">Highscores</a></li> <li class="nav1_divider"><span></span></li> <li class="nav1link"><a href="?page=map">Map</a></li> <li class="nav1_divider"><span></span></li> <li class="nav1link"><a href="?page=forums">Forums</a></li> <li class="nav1_divider"><span></span></li> </ul> </div><!--end nav1--> <div style="clear: both;"></div> <div id="links"> <div id="cont"> <div class="inline"> <div id="forums"><h1><a href="?page=forums">Forums</a></h1></div> <div id="forumstext"></div> </div> <div class="inline"> <div id="map"><h1><a href="?page=map">Map</a></h1></div> <div id="maptext"></div> </div> <div class="inline"> <div id="highscores"><h1><a href="?page=highscores">Highscores</a></h1></div> <div id="highscorestext"></div> </div> </div> </div><!--end links--> </div> <!--end container--> </div><!--end shadow--> </body> </html> This is the content area <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="Kamisoyokaze" /> <title>Like a baws</title> <link href="homestyle.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="shadow"> <div class="container"> <div id="nav2"> <ul id="nav2list"> <li class="nav2link"><a href="?page=home§=updates">Updates</a></li> <li class="nav2_divider"><span></span></li> <li class="nav2link"><a href="?page=home§=events">Events</a></li> <li class="nav2_divider"><span></span></li> <li class="nav2link"><a href="?page=home§=polls">Polls</a></li> <li class="nav2_divider"><span></span></li> <li class="nav2link"><a href="?page=home§=donate">Donate</a></li> <li class="nav2_divider"><span></span></li> </ul> </div><!--end nav1--> <div style="clear: both;"></div> <div id="content"> <div id="cont"> <div class="inline2"> <div id="area1"> <h3 class="title">Lorem ipsum</h3> <h5 class="date">20/03/2013</h5> <p class="textbody">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed urna turpis, tempus id egestas vel, pretium eu ligula. Maecenas consequat fermentum libero, non sollicitudin quam euismod a. Nulla et nunc diam, ut ullamcorper metus. Sed non mi vel dolor cursus ultricies nec vitae nibh. In hac habitasse platea dictumst. In enim odio, ullamcorper eget dignissim laoreet, lobortis sed orci. Vivamus ac ipsum sed purus semper rhoncus malesuada sit amet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam mauris tortor, scelerisque quis ultricies a, tempor id magna. Phasellus at quam id libero cursus malesuada non in sapien. Morbi dictum adipiscing dolor ut lacinia. Praesent elementum dignissim convallis. Donec dolor dolor, volutpat sit amet cursus vel, posuere ac eros. Curabitur in eleifend sem.</p> <h5 class="poster">Posted by Kamisoyokaze</h5> </div> </div> <div class="inline2"> <div id="area2"> <h3 class="title">Lorem ipsum</h3> <h5 class="date">20/03/2013</h5> <p class="textbody">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed urna turpis, tempus id egestas vel, pretium eu ligula. Maecenas consequat fermentum libero, non sollicitudin quam euismod a. Nulla et nunc diam, ut ullamcorper metus. Sed non mi vel dolor cursus ultricies nec vitae nibh. In hac habitasse platea dictumst. In enim odio, ullamcorper eget dignissim laoreet, lobortis sed orci. Vivamus ac ipsum sed purus semper rhoncus malesuada sit amet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam mauris tortor, scelerisque quis ultricies a, tempor id magna. Phasellus at quam id libero cursus malesuada non in sapien. Morbi dictum adipiscing dolor ut lacinia. Praesent elementum dignissim convallis. Donec dolor dolor, volutpat sit amet cursus vel, posuere ac eros. Curabitur in eleifend sem.</p> <h5 class="poster">Posted by Kamisoyokaze</h5> </div> </div> <div class="inline2"> <div id="area3"> <h3 class="title">Picture of The Week</h3> <h5 class="date">20/03/2013</h5> <img src="images/potw.png" /> <h5 class="poster">Posted by Kamisoyokaze</h5> </div> </div> <div style="clear: both;"></div> </div> <div id="footer"><p>Simple server Website (Lomz.dyndns.org) | Designed and coded by Kamisoyokaze | Server ran by Lomz | Beware of Sharks!</p></div> </div><!--end content--> </div> <!--end container--> </div><!--end shadow--> </body> </html>
I C0NN0R I Posted January 29, 2012 Posted January 29, 2012 Wait so is the shadow a seperate image or part of the BG?
severed arow Posted January 29, 2012 Author Posted January 29, 2012 Wait so is the shadow a seperate image or part of the BG? Separate
I C0NN0R I Posted January 29, 2012 Posted January 29, 2012 try "{position: absolute; top: x; left: y}" x and y obv. being the co ords.
severed arow Posted January 29, 2012 Author Posted January 29, 2012 try "{position: absolute; top: x; left: y}" x and y obv. being the co ords. The problem with that is it is inside a div wich contains pretty much everything. if you move it, you move everything else. Usually you can specify the y coords of where you want the bg to start, unfortunately not when its repeating y. There's definitely a way, also why does the background need to repeat?
I C0NN0R I Posted January 30, 2012 Posted January 30, 2012 oops just realised i edited instead of quoting.
![[ FOE ] Final Ownage Elite - #1 OSRS Legacy Pure Clan & Community](https://www.foe-rs.com/forums/uploads/monthly_2022_10/foe_site_logo.png.8ce1cbcdad473d2374bd4ddb4ec47596.png){kind=logo}
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now