Kjapp og trygg hosting for Wordpress

hvordan få scroll bar med iframes

C

cberg70

New Member
Hei, jeg skal lage en hjemmeside.....den består av 4 deler, jeg ønsker å ha scroll bar på den ene cella, den store cella der avisa er avbildet.....ønsker en scroll bar på høyre side i den cella...og iframes må dekke hele den cella.....ønsker ikke vannrett scoll nede i cellen, kun på høyresiden.

Legger med link av siden så dere kan se hvor i html teksten jeg tenker på....jeg har lekt meg litt med iframes og linket en annen side inn til scroll baren og det funker, men jeg får ikke plasser iframes en helt riktig, slik at den dekker hele denne cellen, noen som klarer det her?

petrine

her er html koden til siden, noen som vet hvordan en får den scrolleren riktig her, kan feks bare sette inn VG Nett - Forsiden - VG Nett som referanse til iframes midlertidig...?

<HTML>
<HEAD><TITLE>minside.net</TITLE>
<META content=0 http-equiv=Expires>
<STYLE type=text/css>

body, p, td{
font-family:Verdana;
font-size:8pt;
font-weight:normal;
color:#000000;
margin: 0px;
}

ul, ol, blockquote {
margin: 0px 0px 0px 40px;
padding: 0px;
}

ul {
list-style-type: disc;
}

h1{
font-family:Verdana;
font-size:14pt;
font-weight:bold;
color:#000000;
margin: 0px;
}

h2{
font-family:Verdana;
font-size:10pt;
font-weight:bold;
color:#d6640e;
margin: 0px;
}

h3{
font-family:Verdana;
font-size:8pt;
font-weight:bold;
color:#000000;
margin: 0px;
}

h4{
font-family:Verdana;
font-size:8pt;
font-weight:normal;
font-style:italic;
color:#000000;
margin: 0px;
}

pre{
margin: 0px;
}

a{
color:#d6640e;
text-decoration:none;
}

a:hover{
color:#f3a366;
text-decoration:none;
}

.menu td a{
color:#FFFFFF;
font-size: 8pt;
text-decoration: none;
font-weight:bold;
}

.menu td a:hover{
color:#f3a366;
text-decoration: none;
}

</STYLE>
</HEAD>
<BODY style="MARGIN: 0px; BACKGROUND: #ffffff">
<DIV id=maindiv1 align=center><DIV id=maindiv2 style="WIDTH: 900px; POSITION: relative">
<TABLE style="POSITION: relative; BORDER-COLLAPSE: collapse" id=maintable border=0 cellSpacing=0 cellPadding=0 width=900 align=center>
<TBODY>
<TR>
<TD height=45 vAlign=bottom>
<TABLE style="POSITION: absolute; BORDER-COLLAPSE: collapse; RIGHT: 2px; TOP: 25px" border=0 cellSpacing=0 cellPadding=0 width=450>
<TBODY>
<TR>
<TD vAlign=top align=right>YournameCom © 2007 • Privacy Policy • Terms of Use</TD></TR></TBODY></TABLE></TD></TR>
<TR>
<TD vAlign=top>
<TABLE style="BORDER-COLLAPSE: collapse" border=1 cellSpacing=0 borderColor=#000000 cellPadding=0 width=900>
<TBODY>
<TR>
<TD vAlign=top>
<TABLE style="BORDER-COLLAPSE: collapse" border=0 cellSpacing=0 cellPadding=0 width="100%">
<TBODY>
<TR>
<TD style="BACKGROUND: url(/images/paper-and-pencil/top-pic.jpg)" height=303 vAlign=top>
<P>&nbsp;</P></TD>
<TD style="PADDING-BOTTOM: 20px; PADDING-LEFT: 20px; PADDING-RIGHT: 20px; BACKGROUND: url(/images/paper-and-pencil/right-bg.gif); PADDING-TOP: 20px" vAlign=top width=186>
<H1>News</H1>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P><A href="/#"><B>• Headlines »</B></A></P>
<P>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. </P>
<P>&nbsp;</P>
<P><A href="/#"><B>• Headlines »</B></A></P>
<P>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus.</P>
<P>&nbsp;</P>
<P><A href="/#"><B>• Headlines »</B></A></P>
<P>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. </P>
<P>&nbsp;</P></TD></TR></TBODY></TABLE>
<TABLE style="BORDER-COLLAPSE: collapse" border=0 cellSpacing=0 cellPadding=0 width="100%" height=21>
<TBODY>
<TR>
<TD style="BACKGROUND: url(/images/paper-and-pencil/menu_bg.gif) #000000 repeat-x" vAlign=top>
<TABLE style="BORDER-COLLAPSE: collapse; MARGIN-LEFT: 34px" class=menu border=0 cellSpacing=0 cellPadding=0 align=left height=21 metaid="etterhjelpen" meta="menu">
<TBODY>
<TR>
<TD style="WIDTH: 2px; BACKGROUND: url(/images/paper-and-pencil/menu-left.gif)" width=2><IMG width=1 height=1></TD>
<TD style="PADDING-LEFT: 5px; PADDING-RIGHT: 5px; BACKGROUND: url(/images/paper-and-pencil/menu-bg-active.gif) repeat-x" vAlign=middle align=center><A href="/etterhjelpen.html">Home</A></TD>
<TD style="WIDTH: 2px; BACKGROUND: url(/images/paper-and-pencil/menu-right.gif)" width=2><IMG width=1 height=1></TD></TR></TBODY></TABLE></TD>
<TD style="BACKGROUND: url(/images/paper-and-pencil/side_bg.gif) #d6640e repeat-x 50% bottom" vAlign=top width=225><IMG width=1 height=1></TD></TR></TBODY></TABLE>
<TABLE style="BORDER-COLLAPSE: collapse; BACKGROUND: #ffffff" cellSpacing=0 cellPadding=0 width="100%" height="100%">
<TBODY>
<TR>
<TD style="PADDING-LEFT: 80px; PADDING-RIGHT: 50px" vAlign=top>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<H2>Lorem ipsum dolor sit amet, contetuer adipiscing eacus nean it mauris llus porta. Fusce suscipit varius mi llus porta. Fusce suscipit varius mi.</H2>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P><IMG style="MARGIN-BOTTOM: 5px; MARGIN-RIGHT: 10px" align=left src="/images/paper-and-pencil/newspaper.jpg"></P>
<P><B>Etiam consectetuer accumsan urna. Sed orci. Donec consequat mattis nisi. Aenean ultricies neque sed odio.</B></P>
<P>&nbsp;</P>
<P><I>Etiam consectetuer accumsan urna. Sed orci. Donec consequat mattis nisi. Aenean ultricies neque sed odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam urna metus, commodo idunt vitae, lobortis nec, est. uisque ullamcorper sollicitudin quam.</I></P>
<P>&nbsp;</P>
<P>Ut accumsan pede quis mauris. Quisque eleifend convallis urna. Mauris mauris arcu, cursus sed, viverra at, pellentesque sit amet, mi. Nullam dapibus neque vel ante. Morbi libero pede, aliquet et, hendrerit et, suscipit molestie, elit. Vestibulum nulla sapien, convallis eu, varius eget, blandit eget, tortor Etiam consectetuer accumsan urna. Sed orci. Donec consequat mattis nisi. Aenean ultricies neque sed odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam urna metus, commodo non, tincidunt vitae, lobortis nec, est. </P>
<P>&nbsp;</P>
<P>Quisque ullamcorper sollicitudin quam. Maecenas dignissim, sapien a ornare varius, felis lorem lobortis dolor, ac varius turpis lorem in lorem. Donec auctor semper enim. Praesent vestibulum.</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P></TD>
<TD style="PADDING-LEFT: 20px; PADDING-RIGHT: 20px; BACKGROUND: url(/images/paper-and-pencil/right-bg.gif) repeat-y" vAlign=top width=186>
<P>&nbsp;</P>
<P>&nbsp;</P>
<H2>Lorem ipsum dolor sit amet, contetuer adipiscing eacus nean it mauris llus porta. Fusce suscipit varius mi llus porta. Fusce suscipit varius mi.</H2>
<P>&nbsp;</P><IMG align=middle src="/images/paper-and-pencil/film.jpg">
<P>&nbsp;</P>
<P><I>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris.</I></P>
<P>&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
</DIV></DIV>
</BODY>
 
Pong

Pong

Jeg selger sʇɥƃıluʍop :)
1. bruk divs, ikke tabell
2. den aktuelle cellen har paddings left/right som du bør sette til 0
3. inni trenger du i stedenfor lorum ipsum noe som:
<iframe style="width: 100%; height: 100%; overflow: scroll;" src="http://vg.no"></iframe>
men siden du ønsker kun vertical scrolling, bruk:
overflow: -moz-scrollbars-vertical;
med css3 får du også:
overflow-x og overflow-y; du kan så sette overflow-x til hidden.
 
C

cberg70

New Member
hei og takk

jeg er helt ny med dette og takk for svaret. kunne jeg vært vanskelig og spurt om du hadde giddi og sette det riktig inn i html kosen over her? håper ikke jeg er for frekk nå....har prøvd litt og det er nesten riktig nå men enda ikke helt bra.
 
Du må logge inn eller registrere deg for å svare her.
Topp