webForumDet fria alternativet
Logga in

DIV-fel, hilfe bitte

3 svar · 452 visningar · startad av richi_f

richi_fMedlem sedan apr. 2004206 inlägg
#1

Hej!

En av mina DIV:ar lägger sig fel i Firefox men rätt i IE, jag har använt nästan exakt samma layout på en annan sida som funkar som den ska.

I firefox så lägger sig #sidebar under #main, men i IE så ligger allt som det ska... fattar inte varför.

Jag har använt mig av Jojoxx fina exempel-css som ni säkert ser...

Jag kan inte se var det felar men det kan säkerligen nån av er... ;)

här är koden, har inte gjort css:en extern ännu.

<!--#include file="variables.asp"-->
<%
	'//
	'// Open database, declare variables.
	'//
	Set dbConn = Server.CreateObject("ADODB.Connection")
	Set rsPage = Server.CreateObject("ADODB.Recordset")
	dbConn.Open connString
	dim strSQL
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sv" lang="sv">
<head>
  <title>Franzons R&ouml;r AB</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
/* nollställ marginaler och indrag för alla element - inklusive listor 
   Läs t.ex. [url]http://www.clagnut.com/blog/1287/[/url]  om du inte sett denna förr  */
* {margin:0;padding:0;} 
/* Grundinställningar för visningsytan */
html,body { 
color: #000; 
background: #FFFFCC;

height:100%; /* se till att vi kan utnyttja hela visningsytan */
text-align:center;  /* centrera #container a'la bluerobot.com del 1 */
}
p {
font-family: verdana, helvetica, sans-serif;
font-size: 12px; line-height: 18px;
color: #000; background-color:transparent;
padding: 5px 10px 5px 10px;
}
#container {
width:762px; /* innehållets totala bredd */
min-height:100%;  /* ta upp hela sidan (se MISIE-hack nedan) */
background-image: url(images/main.gif); /* Se alistapart.com "faux columns" */
margin:0 auto;  /* centrera #container a'la bluerobot.com del 2 */
text-align: left; /* ... och del 3 */
}

#header1{
height: 164px;
background-color:#ccc;
background-image: url(images/top.jpg);
}

#menu {
height: 39px;
background-color:#990000;
background-image: url(images/meny.gif);
font-family: verdana, helvetica, sans-serif;
font-size: 16px; line-height: 18px;
background-color:transparent;
margin-left:0px;
margin-top:0px;
text-align:center;
}

#menu a {
	margin-left: 		10px;
	list-style: 		none;
	display: 		inline;
	color: 			#990000;
	padding: 		1px 8px 1px 8px;
	text-decoration: 	none;
	FONT: 			15px georgia, verdana, arial, helvetica, sans-serif;
	font-weight: 		bold;
}

#menu a:hover {
	margin-left: 		10px;
	list-style: 		none;
	display: 		inline;
	color: 			#ffffcc;
	text-decoration: 	none;
	font-weight: 		bold;
}

#menu_under {
height: 20px;
background-color:#990000;
background-image: url(images/topmain.gif);
}

/* tvåspaltad lösning a'la realworldstyle.com del 2*/
#main {
width:522px; /* width+margin-left skall vara < width på #container, med marginal  */ 
	float:left;
	font-family: verdana, helvetica, sans-serif;
	font-size: 12px; line-height: 18px;
	background-color:transparent;
	margin-left:7px;
	margin-top:5px;
}

#main img {
border:0px solid #dddddd;
margin:0;
padding:0;
}

#main a {
text-decoration: none; 	
COLOR: 			#990000;
border-bottom: 1px dotted #6699CC;
}

#main a:hover {
	TEXT-DECORATION: 	none;
	border-bottom: 1px solid #6699CC; 
	COLOR: 			#cccccc;
	BACKGROUND-COLOR: 	#FFFFFF;
}

/* tvåspaltad lösning a'la realworldstyle.com del 1*/
#sidebar {
  width:180px; /* skall vara mindre än margin-left på #main (med marginal) */
	margin-left:539px; /* något mer än bredden på #sidebar */
	font-family: verdana, helvetica, sans-serif;
	font-size: 12px; line-height: 18px;
	background-color:transparent;
	margin-left:7px;
	margin-top:10px;
}

#sidebar a {
text-decoration: none; 	
COLOR: 			#990000;
border-bottom: 1px dotted #6699CC;
}

#sidebar a:hover {
	TEXT-DECORATION: 	none;
	border-bottom: 1px solid #6699CC; 
	COLOR: 			#cccccc;
	BACKGROUND-COLOR: 	#FFFFFF;
}

/* sidfotsmek */
#belowthebottom {
  height:35px;  /* samma som #bottom */
	clear:both;
}
#bottom{
width:762px;
height: 35px; /* height = p height + p margin-top + p margin-bottom */
background-color:#990000;
background-image: url(images/botten2.gif);
margin-top:-35px; /* samma som height */
margin-left:auto;
margin-right:auto;
}

</style>

<!--[if IE]>
<style type="text/css">
/* fulhack - nödvändigt bl.a. pga att MSIE inte förstår min-height */
#container {height:100%}
</style>
<![endif]-->

</head>

<body>
<div id="container">

<div id="header1"></div>

<div id="menu">
   <table ><tr>
        <td align="center" valign="middle" height="39"><a href="default.asp?p=main">Start</a> <a href="default.asp?p=omforetaget">Om Företaget</a> <a href="default.asp?p=gubbarna">Gubbarna</a> <a href="default.asp?p=rundvandring">Rundvandring</a> 
          <a href="default.asp?p=samarbetspartners">Samarbetspartners</a> <a href="default.asp?p=kontakta">Kontakt</a></td>
      </table>
  </div>

<div id="menu_under"></div>

<div id="main">
<p>
 <%
		'//
		'// Open the main page and save info in variables.
		'//
		dim pageId
		dim pageHeadline
		dim pageContent
		dim pageParent
		dim pageASP
		dim pageLink
		
		IF request.QueryString("p") <> "" THEN
			strSQL = "SELECT * FROM sitePages WHERE pageLink = '" &request.QueryString("p") &"'"
		ELSE
			strSQL = "SELECT * FROM sitePages WHERE pageLink = 'main'"
		END IF
		
		Set rsPage = dbConn.Execute(strSQL)
		IF rsPage.EOF THEN
			response.Redirect("default.asp")
		ELSE
			pageId = rsPage("pageId")
			pageHeadline = rsPage("pageHeadline")
			pageContent = rsPage("pageContent")
			pageParent = rsPage("pageParent")
			pageASP = rsPage("pageASP")
			pageLink = rsPage("pageLink")
			
			
			'//
			'// Print the menu
			'//
			strSQL = "SELECT * FROM sitePages WHERE pageParent = 0"
			Set rsPage = dbConn.Execute(strSQL)
			IF rsPage.EOF THEN
				response.write "Ingen meny"
			ELSE
				Do Until rsPage.EOF
			'		Response.Write "<a href=""default.asp?p=" &rsPage("pageLink") &""">" &rsPage("pageHeadline") &"</a><br />"
					rsPage.MoveNext
				Loop
			END IF
		
			'//
			'// print sub menu
			'//
			strSQL = "SELECT * FROM sitePages WHERE pageParent = " &pageId
			Set rsPage = dbConn.Execute(strSQL)
			IF rsPage.EOF THEN
			ELSE
			'	response.write "<p><b>" &pageHeadline &"</b><br />"
				Do Until rsPage.EOF
			'		Response.Write "<a href=""default.asp?p=" &rsPage("pageLink") &""" class=""NotUnderline"">" &rsPage("pageHeadline") &"</a><br />"
					rsPage.MoveNext
				Loop
				response.write "</p"
			END IF
	%>

 <%

				
			'//
			'// Print page.
			'//
			IF pageASP = 0 THEN
				Response.Write pageContent
			ELSE
				ExecuteGlobal pageContent
			END IF 

			'//
			'// If subpage, link back to mainpage.
			'//
			IF pageParent <> 0 THEN
				Set rsSubPage = Server.CreateObject("ADODB.Recordset")
				strSQL = "SELECT * FROM sitePages WHERE pageId = " &pageParent
				Set rsSubPage = dbConn.Execute(strSQL)
				IF rsSubPage.EOF THEN
				ELSE
					response.write "<div align=""right""><a href=""default.asp?p=" &rsSubPage("pageLink") &""">Tillbaka till " &rsSubPage("pageHeadline") &"</a></div><br />"
				END IF
				rsSubPage.Close
				Set rsSubPage = nothing
			END IF

		END IF '// End mainpage.
  %>

</p></div>

<div id="sidebar"><p><FONT face="Verdana, Arial, Helvetica, sans-serif" size=1><STRONG><FONT color=#990000 size=2>Kontakta oss: </FONT></STRONG><br /> <br />
Franzons RÖR AB <br />
Kalmarvägen 9 <br />
590 40 Kisa <br /><br />

Telefon: 0494 - 102 96 <br />
Fax: 0494 - 102 09 <br />
<a href="mailto:info@franzons-ror.se">info@franzons-ror.se</a><br />
<br />
<a href="default.asp?p=karta"><< Karta till oss</a>
</p>
</div>

<div id="belowthebottom">&nbsp;</div>

</div>

<div id="bottom"></div>

</body>
</html>
<%
	'//
	'// Close database.
	'//		
	rsPage.Close
	Set rsPage = nothing
	dbConn.Close
	Set dbConn = nothing
%>

sidan finns att beskåda live på http://www.franzons-ror.se

tantenMedlem sedan nov. 20051 596 inlägg
#2

Prova me den här sidebaren i stället

#sidebar {
width:180px;
float:left;
font-family: verdana, helvetica, sans-serif;
font-size: 12px; line-height: 18px;
background-color:transparent;
margin-left:7px;
margin-top:10px;
}

InsiderMedlem sedan jan. 2000978 inlägg
#3

Felet är att du har deklarerat margin-left 2 ggr på #sidebar.

#sidebar {
  width:180px; /* skall vara mindre än margin-left på #main (med marginal) */
	[B]margin-left:539px;[/B] /* något mer än bredden på #sidebar */
	font-family: verdana, helvetica, sans-serif;
	font-size: 12px; line-height: 18px;
	background-color:transparent;
	[B]margin-left:7px;[/B]
	margin-top:10px;
}

Vänstermarginalen ska vara något större än bredden på #main, enligt tvåspaltad lösning a'la realworldstyle.com
Ta bort den nedersta av de två fetmarkerade raderna.

richi_fMedlem sedan apr. 2004206 inlägg
#4

Tack tanten och Insider, så är det när man sitter för länge o bara glor....

133 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
130 ms — hämta tråd, inlägg och bilagor (db)