Jump to content
Sign in to follow this  
ACD

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

Recommended Posts

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

Edited by ACD

Share this post


Link to post

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.

Edited by Yawa

Share this post


Link to post

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

Edited by ACD

Share this post


Link to post

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.

Share this post


Link to post

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

Edited by Yawa

Share this post


Link to post

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...