Gå til innhold

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


Anbefalte innlegg

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):

 

template_003.jpg

 

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;
}

post-205608-1265993904_thumb.jpg

Endret av ACD
Lenke til kommentar
Videoannonse
Annonse

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 av Yawa
Lenke til kommentar

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 av ACD
Lenke til kommentar

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.

Lenke til kommentar

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 av Yawa
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
×
×
  • Opprett ny...