Link to home
Start Free TrialLog in
Avatar of Nicole1307
Nicole1307Flag for United States of America

asked on

Resize content to screen size

Hi,

I'm finishing up a site and I need to adjust the screen size, it has to scale to fit different screen sizes, without changing background image file.

The site loads a bit slow as well so any suggestions to fix that would be great too.

I've attached the code and here's a link to the site: danielleduganyoga.com
CSS:body { 
background-repeat:no-repeat;
background-position:center;
background-size: auto;

}

#wrapper{
margin-top:20px;
background-repeat:no-repeat;
width:1000px;
height:940px; 
}

#indexlogo { 
padding-left:300px;
}

#indexnav{ padding-top:130px;
} 

#logo{ 
padding-left:175px; 
padding-top:25px;
}

#nav {
padding-top:0px;
}

#box1{
padding-top:5px;
}

#box2sch{
padding-top:10px;
padding-left:150px;
width:380px;
margin-left:5px;
float:left;
}

#box2text{
padding-top:75px;
width:700px;
}
#footer{
position:relative;
top:15px;
}
#indexfooter{
padding-top:790px;
}/* CSS Document */

Open in new window

<body>
<center>
<div id="wrapper" style= "background-image:url(images/backgrounds/home.gif)" onload="MM_preloadImages('images/links/link_schedule.gif','images/links/link_privatelessons.gif','images/links/link_bio.gif','images/links/link_events.gif')" align="center"  >

<div id="indexlogo">
  <img src="images/links/dd_logo_homepg.gif" alt="home logo" longdesc="images/links/dd_logo_homepg.gif" align="left" style="padding-top:85px;"/></div>

<div id="indexnav">
<table border="0" cellpadding="0" cellspacing="10">
    <tr>
      <td><a href="schedule.html" target="_top" onclick="MM_nbGroup('down','group1','schedule','images/links/nav_schedule.gif',1)" onmouseover="MM_nbGroup('over','schedule','images/links/nav_schedule.gif','images/links/nav_schedule.gif',1)" onmouseout="MM_nbGroup('out')"><img src="images/links/nav_schedule.gif" alt="schedule" name="schedule" width="64" height="21" border="0" id="schedule" onload="" /></a></td>
      <td><a href="privatelessons.html" target="_top" onclick="MM_nbGroup('down','group1','privatelessons','images/links/nav_privatelessons.gif',1)" onmouseover="MM_nbGroup('over','privatelessons','images/links/nav_privatelessons.gif','images/links/nav_privatelessons.gif',1)" onmouseout="MM_nbGroup('out')"><img src="images/links/nav_privatelessons.gif" alt="privatelessons" name="privatelessons" width="109" height="21" border="0" id="privatelessons" onload="" /></a></td>
      <td><a href="bio.html" target="_top" onclick="MM_nbGroup('down','group1','bio','images/links/nav_bio.gif',1)" onmouseover="MM_nbGroup('over','bio','images/links/nav_bio.gif','images/links/nav_bio.gif',1)" onmouseout="MM_nbGroup('out')"><img src="images/links/nav_bio.gif" alt="bio" name="bio" width="23" height="21" border="0" id="bio" onload="" /></a></td>
      <td><a href="events.html" target="_top" onclick="MM_nbGroup('down','group1','events','images/links/nav_events.gif',1)" onmouseover="MM_nbGroup('over','events','images/links/nav_events.gif','images/links/nav_events.gif',1)" onmouseout="MM_nbGroup('out')"><img src="images/links/nav_events.gif" alt="events" name="events" width="50" height="21" border="0" id="events" onload="" /></a></td>
    </tr>
  </table>
  </div>
</div>
<div align="center" class="style3" id="footer">
danielle@danielledugan.com</div>
</center>
</body>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Zado
Zado
Flag of United Kingdom of Great Britain and Northern Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Nicole1307

ASKER

Hi Zado,

Thanks for the info. The width is fine actually, its matter of the height really, which makes me think there isn't a way to change it without adjust the background images.

What do you mean by compressing the images?
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
OK, Thanks for for your help.
No problem, glad to help you :-)
Thanks for points.