webForumDet fria alternativet

margin-top

8 svar · 520 visningar · startad av DanneSt

DanneStMedlem sedan feb. 20041 327 inlägg
#1

Varken FF eller Opera verkar fatta margin-top som jag har lagt mot de överliggande divvarna. Nån som har en lösning på det?

zcorpanMedlem sedan dec. 20042 269 inlägg
#2

Om Firefox och Opera är överrens om nånting så är det med största sannolikhet korrekt. Utan att se nån kod gissar jag att du har problem med kollapsande marginaler (ett koncept som IE har en del buggar med).

DanneStMedlem sedan feb. 20041 327 inlägg
#3

Hmm, kollapsande marginaler?
Här är css-koden:

body
{
  padding: 0;
  margin: 0;
  font-family: Georgia, Arial, Verdana;
  font-size: 0.8em;
  background-color: #ffffff;
}

#container
{
  postition; absolute; 
  width: 760px;
  height: auto;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  background: url('images/bkgr.jpg');
  border: 0px solid #000000; 
  padding: 0;  
}

#head
{
  width: 100%;
  height: 100px;
  padding: 0;
  border: 0px solid #000000;
  background: url("images/toppbalk.jpg");
}

#meny
{
  width: 96%;
  height: auto;
  text-align: center;
  font-family: Arial;
  background-color: #ffffff;
  border: 0px solid #000000;
  padding: 0px;
}

#meny a
{
font-size: 1.4em
}

#content
{
  float: left;
  width: 100%;
  \width: 486px;
  w\idth: 490px;
  height: auto;
  overflow-y: auto;
  background-color: #ffffff;
  border: 0px solid #000000;
  padding: 2px;
}

#ordforande
{
  float: left;
  width: 242px;
  \width: 230px;
  w\idth: 242px;
  height: auto;
  overflow-y: auto;
  border-left: 1px dotted #C6CC92;
  background-color: #ffffff;
  padding: 6px;
}

#driftinfo
{
  float: left;
  width: 242px;
  \width: 230px;
  w\idth: 242px;
  height: 80px;
  \height: 76px;
  h\eight: 80px;
  background-color: #ffffff;
  border-top: 1px dotted #C6CC92;
  padding: 2px;
}

#senaste_nytt
{
  float: left;
  width: 242px;
  \width: 230px;
  w\idth: 242px;
  height: 80px;
  \height: 76px;
  h\eight: 80px;
  border-top: 1px dotted #C6CC92;
  background-color: #ffffff;
  border-left: 1px dotted #C6CC92;
  padding: 2px;
}

#epost
{
  float: left;
  width: 242px;
  \width: 230px;
  w\idth: 242px;
  height: 80px;
  \height: 76px;
  h\eight: 80px;
  background-color: #ffffff;
  border-top: 1px dotted #C6CC92;
  border-left: 1px dotted #C6CC92;
  padding: 2px;
}

#footer
{
  clear: both;
  width: 100%;
  height: 28px;
  margin-top: 6px;
  text-align: center; 
  background: url("images/bottombalk.jpg");
  background-color: #ffffff;
  border: 0px solid #000000;
  padding: 0px;
}

a:link { color: #0099ff; text-decoration: none}
a:visited { color: #0099ff; text-decoration: none}
a:active { color: #0099ff; text-decoration: none}
a:hover { color: #aeccff; text-decoration: none}
  
p { color:#000000; font-family: Georgia; font-weight: normal} 
li { color:#000000; font-family: Georgia, Arial, Verdana; font-weight: normal} 
td { color:#000000; font-family: Georgia, Arial, Verdana; font-weight: normal}
tr { color:#000000; font-family: Georgia, Arial, Verdana; font-weight: normal}

h1 { color:#000000; font-family: Arial; font-size: 1.2em; font-weight: bold}
h2 { color:#000000; font-family: Arial; font-size: 1.4em; font-weight: bold; font-style: italic}
h3 { color:#000000; font-family: Arial; font-size: 1.4em; font-weight: normal}

Och här är html-koden:

<div id="container">
 
	<div id="head">
	
	</div>
		
	<div id="meny">
	<!--#Include file="meny.asp"-->
	</div>

	<div id="content">
	<h2>Content</h2>
	<!--#Include file="news/news3.asp"-->
	</div>  
	
	<div id="ordforande">
	<h2>Ordförande har ordet </h2>
	<%ordf_kort = Replace (left(rs("ordforande"), 250), vbCrLf, "<br />")%>
	<%=ordf_kort%>...
	<br /><br />
	<a href="ordforande.asp">Läs mer!</a>
	</div>

	<div id="driftinfo">
	<h2>Driftinfo</h2>
	<%=Replace(Server.HTMLEncode(rs("driftinfo")),vbCrLf,"<br />")%>
	</div>  

	<div id="senaste_nytt">
	<h2>Senaste Nytt</h2>
	&nbsp;&nbsp;
	</div>
			
	<div id="epost">
	<h2>Registrera din e-post</h2>
	<form action="reg_epost.asp">
		<p style="text-align: center">Anmäl din e-post här för snabb 
		info!  
		<input type="text" name="epost" size="15" /> <input type="submit" value="Ok" name="B1" />&nbsp;&nbsp;
		<a target="_blank" href="epost_las_mer.asp">Läs mer!</a></p>
	</form>
	</div>
	
	<div id="footer">
	Wiihaga Samfällighet&nbsp; |&nbsp; Box 70, 86530 
			ALNÖ&nbsp; |&nbsp; <a href="mailto:info@wiihaga.se">info@wiihaga.se</a>
	</div>
	
</div>
zcorpanMedlem sedan dec. 20042 269 inlägg
#4

Är problemet att rubrikerna kommer för långt ner och footern för långt upp?

DanneStMedlem sedan feb. 20041 327 inlägg
#5

Footern kommer för långt upp, över "e-post"-divven.
(https://www.wiihaga.se)

tantenMedlem sedan nov. 20051 658 inlägg
#6

prova med att radera alla height i e-post-diven...

kaxigtMedlem sedan okt. 2004618 inlägg
#7

*html{margin:0; padding:0;}

sedan anger du dina värden som vanligt till dina divar

mvh/Lena

tantenMedlem sedan nov. 20051 658 inlägg
#8

Ser att du inte testat att radera height. Har lite bättre tid nu, så här en liten förklaring.
ur #epost

   height: 80px;
  \height: 76px;
  h\eight: 80px;

De två första vänder sig till samma webläsare så ta bort den med \ före. Finns någon webläsare som lämnar css helt när den hittar den. Kommer inte ihåg nu vilken... Den sista som vänder sig till IE5 ska ha höjden + marginaler.
Men varför jag skrev att du skulle radera alla tre i mitt förra inlägg var för att du ville ju att man skulle kunna förstora text vid behov. Har du bestämd höjd så kommer den att lägga sig över foten som den gör nu, om innehållet blir för stort. Utan bestämd höjd, kommer diven att anpassa sig till innehållet.
Just nu tror jag att innehållet är ungefär 100-105 pixlar hög så antingen ändrar du värdena eller raderar, så ska nog ditt problem vara ur världen...
Men oavsett vad du gör så strunta i hack på höjder...
eller ännu hellre undvik dem över allt... ;)

DanneStMedlem sedan feb. 20041 327 inlägg
#9

Varför är det så enkelt...efter att man har fått lösningen? :-)

Tack alla för Er hjälp!

Genererad på 383 ms · cache AV · v20260730165559-full.f96bc7eb