[Løst]Noen som kan gi veldig enkel (css?)/html-hjelp?

ACD · 12. februar 2010

Jeg bruker en template som jeg tilpasser, men er ikke fryktelig dyktig på css og html. Hjemmesiden ser omtrent ut som vist helt nederst i dette innlegget (sensurert i Paint). Hvordan får jeg mindre tomrom der jeg har markert?

Ble slik da jeg fant ut at jeg skulle legge inn små bilder (nå vist som hvite bokser) i de grå boksene.

Originalt ser denne hjemmesiden slik ut (der small, medium og big er bildefiler med tekst):

Jeg mistenker at dette er et html-problem. Jeg har slettet/byttet innhold i html-fila uten å helt vite hva jeg driver med.

Jeg har også gjort noe rart der det står "ta kontakt i dag". Der vil jeg ikke ha klikkbar tekst, bare helt vanlig hvit tekst med dette innholdet.

Html-kode:

<!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 http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Welcome to Website</title>
<link href="css/stylesheet.css" rel="stylesheet" type="text/css" media="all" />
</head>

<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
<td align="center" valign="top"><table width="754" border="0" cellspacing="0" cellpadding="0">
  <tr>
	<td align="left" valign="top"><table width="754" border="0" cellpadding="0" cellspacing="0" class="header_table">
	  <tr>
		<td align="left" valign="top"><img src="images/header_top.gif" alt="" width="754" height="5" /></td>
	  </tr>
	  <tr>
		<td height="57" align="left" valign="middle" bgcolor="#FFFFFF"><img src="images/logo.gif" alt="" width="208" height="39" class="logo" /></td>
	  </tr>
	  <tr>
		<td align="left" valign="top" class="top_line"><img src="images/line_bg.jpg" alt="" width="1" height="4" /></td>
	  </tr>
	  <tr>
		<td style="white-space:pre; font-weight:bold;" align="right" valign="middle" class="top_menu_bg"><a href="#about.html" class="menu_link">XXX</a> | <a href="#support.html" class="menu_link">XXX</a> | <a href="#services.html" class="menu_link">XXX</a> | <a href="#hostingpackages.html" class="menu_link" style="color:#C70202;">XXX</a> | <a href="#downloads.html" class="menu_link">XXX</a> | </td>
	  </tr>
	  <tr>
		<td style="white-space:pre; color:#FFF;" align="right" valign="middle" class="bottom_menu_bg"><a href="#kontakt.html" class="bottom_link">Ta kontakt i dag!</td>
	  </tr>
	</table></td>
  </tr>
  <tr>
	<td align="left" valign="top"><table width="754" border="0" cellspacing="0" cellpadding="0">
	  <tr>
		<td align="left" valign="top" class="body_box"><table width="736" border="0" cellspacing="0" cellpadding="0">
		  <tr>
			<td align="left" valign="top" class="header_banner"> </td>
		  </tr>
		  <tr>
			<td align="left" valign="top"><table width="736" border="0" cellpadding="0" cellspacing="0" class="services_teable">
			  <tr>
				<td width="237" align="left" valign="top" class="services_bg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
				  <tr>
					<td align="left" valign="top"><img src="images/thumb1.png" alt="SMALL" width="130" height="120" /></td>
				  </tr>
				  <tr>
					<td height="40" align="left" valign="top"> </td>
				  </tr>
				  <tr>
					<td align="left" valign="top" class="white_text">Un-metered Space<br />
					  Un-metered Transfer<br />
					  File Size Limit & Ads<br />
					  <strong>$0.00/month</strong></td>
				  </tr>
				</table></td>
				<td width="12" align="left" valign="top"> </td>
				<td width="236" align="left" valign="top" class="services_bg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
				  <tr>
					<td align="left" valign="top"><img src="images/thumb2.png" alt="MEDIUM" width="130" height="120" /></td>
				  </tr>
				  <tr>
					<td height="40" align="left" valign="top"> </td>
				  </tr>
				  <tr>
					<td align="left" valign="top" class="white_text">Un-metered Space<br />
					  Un-metered Transfer<br />
					  File Size Limit & Ads<br />
					  <strong>$0.00/month</strong></td>
				  </tr>
				</table></td>
				<td width="13" align="left" valign="top"> </td>
				<td width="238" align="left" valign="top" class="services_bg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
				  <tr>
					<td align="left" valign="top"><img src="images/thumb3.png" alt="BIG" width="130" height="120" /></td>
				  </tr>
				  <tr>
					<td height="40" align="left" valign="top"> </td>
				  </tr>
				  <tr>
					<td align="left" valign="top" class="white_text">Un-metered Space<br />
					  Un-metered Transfer<br />
					  File Size Limit & Ads<br />
					  <strong>$0.00/month</strong></td>
				  </tr>
				</table></td>
			  </tr>
			</table></td>
		  </tr>
		  <tr>
			<td align="left" valign="top"><table width="736" border="0" cellspacing="0" cellpadding="0">
			  <tr>
				<td width="509" align="left" valign="top"><table width="509" border="0" cellspacing="0" cellpadding="0">
				  <tr>
					<td width="19" align="left" valign="top"><img src="images/box_left_top.gif" alt="" width="19" height="32" /></td>
					<td align="left" valign="top" class="box_top_bg"> </td>
					<td width="19" align="left" valign="top"><img src="images/box_right_top.gif" alt="" width="19" height="32" /></td>
				  </tr>
				  <tr>
					<td align="left" valign="top" class="left_line"> </td>
					<td style="text-align:justify;" align="left" valign="top">

						tekst tekst tekst.<br /><br />

						tekst tekst tekst.<br /><br />

						tekst tekst tekst.<br /><br />

						tekst tekst tekst
					</td>
					<td align="left" valign="top" class="right_line"> </td>
				  </tr>
				  <tr>
					<td align="left" valign="top"><img src="images/box_bottom_left.gif" alt="" width="19" height="8" /></td>
					<td align="left" valign="top" class="bottom_line"><img src="images/spacer.gif" alt="" width="1" height="1" /></td>
					<td align="left" valign="top"><img src="images/box_bottom_right.gif" alt="" width="19" height="8" /></td>
				  </tr>
				</table></td>
				<td width="19" align="left" valign="top"> </td>
				<td width="209" align="left" valign="top"><table width="209" border="0" cellspacing="0" cellpadding="0">
				  <tr>
					<td width="19" align="left" valign="top"><img src="images/box_left_top.gif" alt="" width="19" height="32" /></td>
					<td align="left" valign="top" class="box_top_bg"> </td>
					<td width="19" align="left" valign="top"><img src="images/box_right_top.gif" alt="" width="19" height="32" /></td>
				  </tr>
				  <tr>
					<td align="left" valign="top" class="left_line"> </td>
					<td align="left" valign="top"><strong>28-nov-2011</strong> Donec justo neque, condimentum et, porttitor et, condimentum sit amet, odio. Sed luctus diam eu nulla.<br />
					  <br />

						<strong>26-nov-201</strong> Donec justo neque, condimentum et, porttitor.<br />
					  <br />
					  <strong>22-nov-2011</strong> Donec justo neque, condimentum et, porttitor et, condimentum sit amet, odio.<br />
					  <br /></td>
					<td align="left" valign="top" class="right_line"> </td>
				  </tr>
				  <tr>
					<td align="left" valign="top" class="left_line"> </td>
					<td height="30" align="right" valign="middle"><a href="#more.html" class="body_link">more</a></td>
					<td align="left" valign="top" class="right_line"> </td>
				  </tr>
				  <tr>
					<td align="left" valign="top"><img src="images/box_bottom_left.gif" alt="" width="19" height="8" /></td>
					<td align="left" valign="top" class="bottom_line"><img src="images/spacer.gif" alt="" width="1" height="1" /></td>
					<td align="left" valign="top"><img src="images/box_bottom_right.gif" alt="" width="19" height="8" /></td>
				  </tr>
				</table></td>
			  </tr>
			</table></td>
		  </tr>
		</table></td>
	  </tr>
	</table></td>
  </tr>
  <tr>
	<td align="left" valign="top"><table width="754" border="0" cellpadding="0" cellspacing="0" class="footer_table">
	  <tr>
		<td align="left" valign="bottom" class="footer_bg">			<br />
		  Copyright © 2010 XXX. All Rights Reserved.</td>
<!--
We request you retain the full web design copyright notice below including the link to http://www.sarkis-webdesign.com
This not only gives respect to the large amount of time given freely by the designer but also helps build interest, traffic and use of template.<br />

Good luck!
sarkis-webdesign.com
// -->
		<td width="136" align="left" valign="top"><a href="http://www.sarkis-webdesign.com/" title="Web Design" target="_blank"><img src="images/web-design.gif" alt="Web Design" width="136" height="25" border="0" /></a></td>
	  </tr>
	</table></td>
  </tr>
</table></td>
 </tr>
</table>
</body>
</html>

CSS-kode:

/* CSS Basic Document */
body
{
margin:0px auto;
padding:0px;
background-color:#333333;
}
.header_table
{
margin-top:6px;
}
.logo
{
margin-left:10px;
}
.body_box
{
padding:9px;
color: #5C5C5C;
background-color:#FFFFFF;
}
.header_banner
{
background:url(../images/header_banner_2.jpg) center top no-repeat;
height:196px;
}
.services_bg
{
background:url(../images/services_bg.gif) left top no-repeat;
height:117px;
padding:10px;
}
.services_teable
{
margin-top:8px;
margin-bottom:12px;
}
.left_line
{
border-left:1px solid #E6E6E6;
}
.right_line
{
border-right:1px solid #E6E6E6;
}
.bottom_line
{
border-bottom:1px solid #E6E6E6;
}
.footer_table
{
margin-bottom:25px;
}




/* CSS Background Image Document */
.top_line
{
background:url(../images/line_bg.jpg) left top repeat-x;
height:4px;
}
.top_menu_bg
{
background:url(../images/top_menu_bg.jpg) left top repeat-x;
height:26px;
padding-right:12px;
}
.bottom_menu_bg
{
background:url(../images/bottom_nenu_bg.jpg) left top repeat-x;
height:22px;
padding-right:13px;
}
.box_top_bg
{
background:url(../images/box_top_bg.gif) left top repeat-x;
height:32px;
}
.footer_bg
{
background:url(../images/footer_bg.gif) left top no-repeat;
height:25px;
}




/* CSS Text Document */
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: 14px;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #5C5C5C;
text-decoration: none;
}
.menu_link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: 26px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #5C5C5C;
background-color:inherit;
text-decoration: none;
}
.menu_link:hover
{
color:#C70202;
text-decoration:none;
background-color:inherit;
}
.bottom_link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: 22px;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #FFFFFF;
background-color:inherit;
text-decoration: none;
}
.bottom_link:hover
{
color:#C6C6C6;
text-decoration:underline;
background-color:inherit;
}
.white_text
{
color:#FFFFFF;
text-decoration:none;
background-color:inherit;
}
.body_link
{
color:#5C5C5C;
text-decoration:underline;
background-color:inherit;
}
.body_link:hover
{
text-decoration:none;
color:#212121;
background-color:inherit;
}

Endret 12. februar 2010 av ACD

Yawa · 14. februar 2010

kan hjelpe deg, men hadde vert greit om du hadde en link til siden din... Mye lettere å finne riktig plass å foreta endringene du ønsker...

Forresten, ser at denne siden er bygget opp med <table>'s... ikke bra. <table>'s brukes til, ja, tabeller. Ikke for å strukturerer siden.

Endret 14. februar 2010 av Yawa

ACD · 14. februar 2010

Jeg har prøvd meg litt fram, og fikk fiksa problemet. Men ble unødvendig forvirret av tabell-systemet.

Er mer eller mindre i boks med hjemmesiden, og så får jeg heller oppdatere om det er noe mer jeg lurer på.

Takk for viljen til å hjelpe, Yawa

Endret 15. februar 2010 av ACD

Yawa · 15. februar 2010

godt å høre at du får det til... Poste den her en vei da, så vi kan se den...

ACD · 15. februar 2010

La den ut her. Skulle ikke ha "ta kontakt i dag" som link til kontakt.html eller noe annet, men får nok til det selv.

Og det eneste som gjenstår da er å tilpasse litt i css-fila så jeg minker tomrommet ned til hovedteksten, og kanskje ordne meg en mer tiltalende meny.

Yawa · 16. februar 2010

merk teksten du vil endre, og høyreklikk i nettleseren din. Velg "Vis kildekode"/"View page source" eller lignene. så ser du hvor du skal foreta endringene du ønsker...

HER: (linje 27 trur jeg)

> <a href="#kontakt.html" class="bottom_link">Ta kontakt i dag!</a>

Hadde jeg vert deg, ville jeg flyttet absoultt all CSS til en egen fil...

Ser at det er en del CSS i HTML fila di

Endret 16. februar 2010 av Yawa

Logg inn

[Løst]Noen som kan gi veldig enkel (css?)/html-hjelp?

Anbefalte innlegg

ACD

Lenke til kommentar

Videoannonse

Yawa

Lenke til kommentar

ACD

Lenke til kommentar

Yawa

Lenke til kommentar

ACD

Lenke til kommentar

Yawa

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer