Forum: web design and graphics community

Celestial Star Forum > Web Development > Coding > Div help^^;

Pages: [1]

« previous next »

Author

Topic: Div help^^; (Read 424 times)

Mandy

Guest

Div help^^;

« on: January 16, 2007, 07:27:58 PM »

I made a div layout for my blog but the images doesn't show up. its supposed to look like this

http://img442.imageshack.us/img442/6936/examplewn5.jpg

but the only thing that works is the content. Oh and the css doesn't work either

heres the code:

Code:

<html>
<head>
<title>&dagger;&hearts;Twilight Radiance&hearts;&dagger;</title>
<style type="text/css">
body{
font-style: normal;
font-weight: normal;
font-family: Century Gothic;
font-size: 11px;
color: #2b89c6;
cursor: default;
background-color: #d7eaf6;
background-repeat: repeat-y;
scrollbar-face-color: #92d3fe;
scrollbar-highlight-color: #70c4fc;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #4eabe8;
scrollbar-shadow-color: #FF431A;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #afdffe;
}

textarea,input {
color :#2b89c6;
font :9px Badley Hand ITC;
border :1px solid #FFFFFF;
decoration :dotted;
hspace :2;
background :#b9dcf4;}

a:hover
{filter:Alpha(opacity=50)}
text-decoration: none;
font-weight: bold;
color: #b5daf2;
font-weight: bold;
color: #2b89c6;
font-weight: bold;
padding-left: 0px;
font-size: 12px;
letter-spacing: 2px;
backgound-color: #FFFFFF;
}

A:visited {
text-decoration: none;
cursor: se-resize;
color: #b5daf2;
font-size: 11px;
font-weight: bold;
}

A:active {
text-decoration: none;
cursor: se-resize;
color: #b5daf2;
font-size: 11px;
font-weight: bold;
}

#nav-menu ul
{
list-style: none;
padding: 0;
margin: 0;
}

#nav-menu li
{
margin: 0px;
padding:0px;
text-decoration: none;
}

#nav-menu li a:link, #nav-menu li a:active, #nav-menu li a:visited {
display: block;
height: 135px;
width: 170px;
border: 1px solid #c7e2fe;
background: url(activebg.gif) repeat #FFFFFF;
text-align: center;
padding-top: 11px;
text-decoration: none;
color: #7ac3ff;
font-weight: normal;
}

#nav-menu li a:hover
{
color: #FFFFFF;;
border: 1px solid #FFFFFF;
background: url(hoverbg.gif) repeat #000000;
}

.head {
width : 365px;
color: #027EC4;
height : 34px;
border: 0px;
text-align: left;
text-indent : 40px;
font: 15px century gothic;
font-weight:bold;
margin-bottom:10px;
padding : 0px;
background: url(head.gif) repeat;}

.nav {
color: #367ead;
font-weight: bold;
padding-left: 3px;
font-size: 12px;
color: #000000;
letter-spacing: 0px;
background-image: url('navhead.gif');
background-color: #90d2fe;
text-align: center;
text-transform: uppercase;
}

.outline {
color: #b5daf2;
font-size: 12px;
font-family: Bradley Hand ITC;
border: 1px solid #FFD8C7;
}

input, textarea, {
color: #2b89c6;
font-size: 11pt;
font-family: Century Gothic;
background: #b5daf2;
border: 1px solid #FFFFFF;
}

</style>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/blue-layout_01.jpg" width="1024" height="110" alt=""></td>
</tr>
<tr>
<td>
<img src="images/blue-layout_02.jpg" width="1024" height="109" alt=""></td>
</tr>
<tr>
<td>
<img src="images/blue-layout_03.jpg" width="1024" height="110" alt=""></td>
</tr>
<tr>
<td>
<img src="images/blue-layout_04.jpg" width="1024" height="110" alt=""></td>
</tr>
<tr>
<td>
<img src="images/blue-layout_05.jpg" width="1024" height="110" alt=""></td>
</tr>
<tr>
<td>
<img src="images/blue-layout_06.jpg" width="1024" height="109" alt=""></td>
</tr>
<tr>
<td>
<img src="images/blue-layout_07.jpg" width="1024" height="110" alt=""></td>
</tr>
</table>

</body>
</html>
<body>
<div id="layout">
<div style="position: absolute; left: 71px; top: 684px; width: 169px"></div>
<div id="navigation">

<div align="center">Site</div>
<br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net">main</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/credits.php">credits</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/apply.php">apply</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/staff.php">staff</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/contact.php">contact</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/awards.php">awards and gifts</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/faq.php">faq</a></br>
<br><img src="star.gif"> <a href="http://twilight-radiance.net/TermsofUse.php">TOU</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/tagboard.php">tagboard</a></br>
</div>

<br></br>
<br></br>

<div id="navigation">

<div align="center">Status</div>
<br>
</BR><?php $visitorip = $_SERVER['REMOTE_ADDR'];
echo "$visitorip"; ?></BR>
<BR><a href="http://www.fastonlineusers.com">
<script type="text/javascript" src="http://fastonlineusers.com/on2.php?d=www.twilight-radiance.net"></script> online&hearts;</a></BR>
</center><BR><img src="button.gif"></BR></center></br></div>

<br></br>
<br></br>

<div id="navigation">

<div align="center">Graphics</div>
<br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/png.php">png</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/brushes.php">brushes</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/entersigns.php">enter signs</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/hiatus.html">hiatus signs</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/movedsigns.php">moved signs</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/404signs.php">404 signs</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/banner.php">banners</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/avatars.php">avatars</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/textures.php">textures</a></br></div>

<br></br>
<br></br>

<div id="navigation">

<div align="center">Hosting</div>
<br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/rules.php">rules</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/apply02.php">apply</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/sponsoring.php">sponsoring</a></br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/hosting.php">hosting</a></br></div>

<br></br>
<br></br>

<div id="navigation">

<div align="center">Extra</div>
<br>
<br><img src="star.gif"><a href="http://twilight-radiance.net/sotm.php">sotm</a></br></div>

<div style="position: absolute; left: 71px; top: 684px; width: 169px"><b>link</b> <b>link</b>
<b>Content here....</div>

</div>
</body>
</html>


	Logged

Blackstone

Administrator
Valkyrie Randgris

Posts: 821

Oh look! People!

Div help^^;

« Reply #1 on: January 16, 2007, 08:05:21 PM »

I modified your post to wrap the code in the code tags. I hope you don't mind.

There are various reasons as to why your images may not be showing. Make sure that they are named correctly (they have the same name as the one you have written in your code), and make sure that they are in a subfolder named 'images', which is what you have written in your code.

Your CSS is probably not working because your divs are named differently than the stylesheets you have in your CSS. Remember to use # when styling an id, and . when styling a class. For example, if you used

Code:

in your HTML, then you would have to use:

Code:

.navagation {

}

In your CSS. If you used

Code:

Then you would need

Code:

#navagation {

}

For your CSS. Also, make sure that your id or class matches that which is specified in your CSS, otherwise it won't work.


	Logged

Mandy

Guest

Div help^^;

« Reply #2 on: January 16, 2007, 08:07:26 PM »

l thanks i'll try it^^


	Logged

Pages: [1]

« previous next »

Jump to:

Forum: web design and graphics community

General

Art boards

Web development

Off-topic