This forum is no longer open and is for reading/searching only.

Please use our new MachForm Community Forum instead.

MachForm Community Forums » MachForm 2

Form Width Question

Started 12 years ago by Shela | 6 posts |


  1. Shela
    Member

    I have made a logo header for my form but I can't seem to find out how to control the width of the form itself to match the logo header, the form adjusts to the screen size when displayed on different monitors. I want the form to be a static size Thanks for any help.

    My form is here: http://heartsongportraits.com/2013RockStars

    Posted 12 years ago #

  2. Saghalie
    Pro Member

    Well, the control for the width and such is in the css file and it looks like you created the header image directly in to the HTML document. Go in to machform and edit the CSS and find the logo section and enter the image info there.

    Regards,

    Saghalie
    http://www.kcmhosting.com

    Posted 12 years ago #

  3. Saghalie
    Pro Member

    IT should look like this:

    /**** Logo Section *****/

    #main_body h1
{
	margin:0;
	min-height:0;
	padding:0;
	text-decoration:none;
	text-indent:-8000px;
	background-image: url('http://www.heartsongportraits.com/machformlogoheader.jpg');
	background-repeat: no-repeat;
}

    Hope this helps

    Saghalie
    http://www.kcmhosting.com

    Posted 12 years ago #

  4. Shela
    Member

    Thanks for the quick response Saghalie - I tried your suggestion and apparently I'm doing something wrong - it did not work for me. I edited the code as suggested and copied the new css embed code, then deleted the header code from my html document and pasted the new css code but the header did not appear and the form width did not change either. Any other suggestions - sorry I need so much hand-holding. Thanks!

    Posted 12 years ago #

  5. Shela
    Member

    I started over from scratch and created a new form - edited the css code as suggested - when I click on 'view form' inside of machform - it looks great - the logo header shows and the form is centered and is the same size as the header.

    BUT

    when I open it in any browser (tried IE, chrome and safari) the logo header does not show up, the form is all the way to the left and the form is the full size of the screen.

    What am I doing wrong? Thanks.

    Posted 12 years ago #

  6. thebridge
    Member

    That's because your html code is pretty messy, plus you have the iframe width set to 100% so it will use the whole page, your image is 639px so setting the iframe width the same will make it the same size, then wrap the iframe in centering div tags will place it where you want it.

    This will fix it

    <!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>
    <title>
      Heartsong Portrait Studio - 2013 Rockstar Rep Application
    </title>
  </head>
  <body>
    <div style="text-align:center;">
      <img src="http://www.heartsongportraits.com/machformlogoheader.jpg" alt=
      "Heartsong Portrait Studio" /><br />
      <br />

      <iframe height="1577" allowtransparency="true" frameborder="0" scrolling=
      "no" style="width:639px;border:none" src=
      "http://heartsongportraits.com/machform/embed.php?id=2" title=
      "2013 ROCKSTAR REP Application"></iframe>
    </div>
  </body>
</html>
    Posted 12 years ago #

RSS feed for this topic

Reply