Object-centered alignment problem

Hi, I want to have 2 objects text with links on the side centered on the other is a contact form.

I've included two images, one is my best result has been done using tables (which I was not happy as I couldn't change their margins) and the second is an image published on ps to clarify what I want.

http://postimage.org/image/c0j8z6for

http://postimage.org/image/e6ilqspgr/

HTML

<! doctype html >

< html >

< head >

< meta charset = "utf-8" >

< title > Untitled Document < /title >

< link rel = "stylesheet" type = "text/css" href = "layout.css" >

< / head >

< body >

< div class = "wrapOverall" >

< div class = 'container' id = "header container" > < div class = "header" >

"" < img class = "logo" src = "... / Home/images/images/Home-Page_03.png" width = "447" height = "69" boreder = "0" / >

< div class = "navMain" >

< div class = "navMain" >

< ul >

"" < li > < a href = "#" > < img src = "... / home/images/Home-Page_06 home.png" width = "52" height = "13" border = "0" alt = "Home" > < / has >

"" < li > < a href = "#" > < img src = "... / home/images/Home-Page_08 portfolio.png" width = "92" height = "13" border = "0" alt = "Portfolio" > < / has >

"" < li > < a href = "#" > < img src = "... / home/images/home-Page_10 pricing.png" width = "57" height = "13" border = "0" alt = "Pricing" > < / has >

"" < li > < a href = "#" > < img src = "... / home/images/Home-Page_12 about.png" width = "54" height = "13" border = '0' alt = 'About' > < / has >

"" < li > < a href = "#" > < img src = "... / home/images/Home-Page_14 blog.png" width = "40" height = "13" border = "0" alt = "Blog" > < /a >

"" < li > < a href = "#" > < img src = "... / home/images/Home-Page_16 contact.png ' width = '79' height = '13' boreder = '0' alt = 'Contact' > < / has >

< /ul >

< / div > <! - END navMain - >

< / div > <! - logo END - >

< / div > <!--END header--> < / div >

<! - MAIN CONTENT - >

< Center > < table >

< b >

< td width = "208" >

< div id = "leftContact" >

"< h5 > < img class ="email"> < img src="images/images/Contact_Email.jpg "width ="106"height ="25"> < / h5 >

"< h5 > < img class ="emailad"> < a href =" # "> < img src="images/images/Conatct_Email_ad.jpg "width ="175"height ="23"> < / has > < / h5 >

< h5 > < / h5 >

< h5 > < / h5 >

"< h5 > < img src="images/images/Contact_Follow.jpg "width ="168"height ="25"> < / h5 >

"< h5 > < a href =" # "> < img src="images/images/Contact_fb.jpg "width ="103"height ="23"> < /a > < / h5 >

< / div >

< table >

< td width = "500" >

" < div id ="rightContact"> < iframe width ="500"height ="550"frameborder ="0"src =" http://www.foxyform.com/form.php?id=355482 & sec_hash = cd579c6c6a8 "> < / iframe > < / div > .

< table >

< /tr >

< / table > < / center >

<! - END MAIN CONTENT - >

< div class = 'container' id = "footer" > < div class = "footer" >

"" < img src = "... / Home/images/images/Home-Page_25-copyright_25.png" alt = "" width = "166" height = "30" class = 'copyright' boreder = "0" / > "

< div class = "fbLike" >

< script type = "text/javascript" >

BeginOAWidget_Instance_2149022: #OAWidget

var urlToLike = ' http://www.facebook.com/DKphotos.net';

If (urlToLike == ") {}

urlToLike = window.location.href;

}

urlToLike = encodeURIComponent (urlToLike);

var font = encodeURIComponent ('arial');

document.write (' ' < iframe src = "http://www.facebook.com/widgets/like.php?locale=en_US & href = ' + urlToLike + ' & layout = button_cou nt & show_faces = false & width = 450 & height = 150 & action = like & font =" + police + & colorscheme = light"scrolling =" "frameborder ="0"allowTransparency ="true"style =" border: none; ") border-color: #ffffff; overflow: hidden; width: 450; height: 150 "(>< / iframe >') "

EndOAWidget_Instance_2149022

< /script >

< / div > <! - END fbLike - >

< / div >

< / div > < / div >

< / div > <! - END wrapOverall - >

< / body >

< / html >

CSS

@charset "utf-8";

/ * CSS document * /.

{body

background-image: url(images/bg_body.jpg);

background-color: #ffffff;

background-attachment: fixed;

background-position: top;

margin: 20px;

}

Wrap {}

position: relative;

margin: 100;

/ * Replace with your width 900px * /.

Width: 1920px;

}

{.wrapOverall}

Width: 1920px;

display: inline;

}

. Container {}

Width: 100%;

min-width: 1100px;

Max-width: none;

}

. Header {}

background-image: url url(images/images/Home-Page_03.png);

background-repeat: repeat no.;

background-position: top center;

height: 97px;

}

{img.logo .header

float: left;

margin: 15px 0px 10px 15px;

}

{.navMain}

margin: 15px 12px 12px 0px;

float: right;

}

.Footer img.copyright {}

float: left;

margin: 5px 15px 0px 15px;

}

.footer div.fbLike {}

float: left;

margin: 5.6px 0px 0px 0px;

}

/* ##############################*/

/ General Navigation rules * /.

/* ##############################*/

.navMain ul {}

margin: 0px;

padding: 0px;

}

.navMain ul li {}

margin: 0px;

padding: 0px 15px;

list-style: none;

display: inline;

}

.navMain ul li a {}

margin: 0px;

padding: 0px;

}

.navMain ul li a: hover {}

}

.leftContact img.email {}

margin: 0px 0px 0px 0px;

}

{.rightContact}

margin: 0px 20px 40px 0px;

}

#header, #footer {}

Width: 100%;

float: left;

}

#footer {}

position: fixed;

low:-125px;

z index: 999999;

background-color: #FFF;

}

{img.logo .header

float: left;

margin: 15px 0px 10px 15px;

}

Thank you

Use CSS on parent container width 900px and Center it with margin-left and margin-right of auto.

#container {}

Width: 900px;

Auto margin: 0;

border: 1px dotted Red;

}

Use floats and margins to align internal elements (boxes) in the container parent.

http://ALT-Web.com/demos/3-CSS-boxes.shtml

Nancy O.

Tags: Dreamweaver

Similar Questions

  • Selection of object to align problems

    I'd like to understand how Illustrator decides what is the key object when you use the "align to Key object. For me, it adjudicates an uncanny percentage of time being bad. You would think it would do as well as random, but no.

    I understand that when he chose the bad object to align to, I have to then select the item I want, but sometimes it will be not just to highlight the favorite object. Why? Ideas on how to control the process?

    (Freehand had the good sense to have an easily understandable when sequence centering; it aligned with the object that was greater in the locate line.) Easy.)

    Thank you

    Dave

    To align a selection of first key object all objects, and then with the black pointer click the key object. This turns on the feature and highlight the selection of the object key with a blue line to indicate it. You don't have to use the menu drop down. If you use the pull-down menu without clicking first with the Selection tool on one Illustrator selected objects align to one of the selected objects located above the battery.

  • alignment problem

    Hi, I have an alignment problem with my program. I use two verticalfieldmanager in a horizontalfieldmanager to display two columns. The problem is, according to the Simulator tha I use, the text seems aligned or not. In 9000, there is no problem, because the width of the screen is great. But if I use the 8110, which has a narrower screen, this problem occurs. How can I solve this problem for all simulators? Thank you. My code:

    SerializableAttribute public class DetallesOfertaScreen extends form {}
          
    GestNearController controller;
    Horizontal CustomHorizontalManager;
    VerticalFieldManager campos;
    VerticalFieldManager labels;
    RoundRectVerticalManager contGlobal;
    RoundRectContainer contProyecto;
          
          
          
    public DetallesOfertaScreen (GestNearController controller) {}
              
    This.Controller = controller;

    Cabecera
    setTitle ("Datos cabecera");

    If (Controller.getOfertaActual ()! = null) {}
                  
    Campos = new VerticalFieldManager();
    labels = new VerticalFieldManager();
    horizontal = new CustomHorizontalManager();
    contGlobal = new RoundRectVerticalManager();
    contProyecto = new RoundRectContainer();
              
    TAM int = Controller.gettamanoscreen ();
    Fuente1 of police;
    Fuente2 of police;
                  
    If {(tam > 320)
    fuente1 = Util.getNewFont (21, Font.BOLD);
    fuente2 = Util.getNewFont (21, Font.PLAIN);
    labels.setFont (fuente1);
    campos.setFont (fuente2);
    }
    ElseIf (tam<>
    fuente1 = Util.getNewFont (15, Font.BOLD);
    fuente2 = Util.getNewFont (15, Font.PLAIN);
    labels.setFont (fuente1);
    campos.setFont (fuente2);
    }
    else {}
    fuente1 = Util.getNewFont (19, Font.BOLD);
    fuente2 = Util.getNewFont (19, Font.PLAIN);
    labels.setFont (fuente1);
    campos.setFont (fuente2);
    }
                  
    LabelField labelArea = new LabelField("Área:");
    LabelField labelLinea = new LabelField("Línea:");
    LabelField labelVO = new LabelField("VO:");
    LabelField labelTitulo = new LabelField("Título:");
    LabelField labelCliente = new LabelField("Cliente:");
    LabelField labelFechaOfer = new LabelField ("date offer :");
    LabelField labelFechaCom = new LabelField ("date beginning :");
    LabelField labelFechaPrev = new LabelField ("date Aprobacion :");
    LabelField labelJProy = new LabelField ("Jefe proyecto :"); ")
    LabelField labelMeses = new LabelField("Meses:");
    LabelField labelProbabilidad = new LabelField("Probabilidad:");
    LabelField labelHorasPrev = new LabelField ("Horas Previstas :");
    LabelField labelRevision = new LabelField("Revisión:");
    LabelField labelSector = new LabelField("Sector:");
              
    Offer OfertaDTO = controller.getOfertaActual ();
              
    String FechaCom = oferta.getFechaComienzo ();
    String months = oferta.getMesesNum ();
    String HorasPrev = oferta.getHorasPrev ();
    String revision = oferta.getRevision ();
    VO string = oferta.getVO ();
    String date = oferta.getFechaCreacion ();
    String title = oferta.getTitulo ();
    String client = oferta.getCliente ();
    Sector of strings = oferta.getSector ();
    String line = oferta.getLinea ();
    String domain = oferta.getArea ();
    String JefeProyecto = oferta.getJefeProyecto ();
    String FPrevAprob = oferta.getFechaPrevAprob ();
    String probability = oferta.getProbabilidad ();
              
    LabelField input1 = new LabelField (Area);
    LabelField to input2 = new LabelField (Linea);
    Input3 LabelField = new LabelField (VO);
    Input4 LabelField = new LabelField (title);
    LabelField input5 = new LabelField (client);
    LabelField input6 = new LabelField (FechaCom);
    LabelField input7 = new LabelField (FPrevAprob);
    LabelField input8 = new LabelField (date);
    LabelField input9 = new LabelField (JefeProyecto);
    LabelField input10 = new LabelField (months);
    LabelField input11 = new LabelField (probability);
    LabelField input12 = new LabelField (HorasPrev);
    LabelField input13 = new LabelField (Revision);
    LabelField input14 = new LabelField (Sector);
              
    Añadimos a los contenedores
    labels. Add (labelArea);
    labels. Add (labelLinea);
    labels. Add (labelVO);
    labels. Add (labelTitulo);
    labels. Add (labelCliente);
    Para activar el scroll
    labels. Add (new NullField());
    labels. Add (labelFechaOfer);
    labels. Add (labelFechaCom);
    labels. Add (labelFechaPrev);
    labels. Add (labelJProy);
    labels. Add (labelMeses);
    labels. Add (labelProbabilidad);
    labels. Add (labelHorasPrev);
    labels. Add (labelRevision);
    labels. Add (labelSector);
                  
    Campos.Add (INPUT1);
    Campos.Add (INPUT2);
    Campos.Add (INPUT3);
    Campos.Add (INPUT4);
    Campos.Add (input5);
    Campos.Add (input8);
    Campos.Add (input6);
    Campos.Add (input7);
    Campos.Add (INPUT9);
    Campos.Add (input10);
    Campos.Add (input11);
    Campos.Add (input12);
    Campos.Add (input13);
    Campos.Add (input14);
                  
                  
    horizontal. Add-on (labels);
    horizontal. Add (Campos);
              
    contProyecto.add (horizontal);
    contGlobal.add (contProyecto);
    Add (contGlobal);
              
    }
    else {}
    Dialog.Alert ("invalid offer!");
    }
              
    }

    ...

    With 8110:

    Thank you!!

  • Alignment problem to guide

    I struggled to try to scale an object to align a guide. Whenever I tried to zoom, I see that this isn't a very perfect wink...

    I have two 'nod to the point"and"snap to grid"checked.

    Y at - it a way to actually align with the guide. I've seen many discussions about snapping to guides does not...

    img1.png

    Johney,

    In such cases, the first assumption is aligned to the pixel grid.

    You can select the entire document and untick finally align on the pixel grid in the Transform palette and uncheck also align new objects to the pixel grid in the options of the Launcher.

    You can avoid the types of documents with the default (RGB for the web and other) or change the default value for such documents.

    But snap to grid is notorius for playing with smart guides, so that you can try without it, too.

  • Weird alignment problem

    I think it might have something to do with my work on a small document - 48 * 48 icon - but maybe not.

    I have some strange alignment problems. I have an arrow head, I try to line up on a tree, and no matter what I do, they refuse to align the death. The alignment buttons don't work, dragging manually won't work - it falls right on 1px on each side where I want.

    Any ideas what's happening? I have no guides that would have an impact on it.

    Make sure you have not align on the pixel grid is activated in the transformation Panel.

    Although, if you prepare the content that will eventually be pixel based, leave this setting on ensures things seem to be crunchy in pixels.

  • Lines of connection, centering and alignment problems

    Hello

    Hope you are well.

    I have a few questions about the joint:

    1.) as you will see, there are areas in the upper and lower lines rows (paths?) that intersect each other. It wouldn't be a problem if the opacity was lowered on them, but since it is, how can I make it look like they connect with each other? I tried the pen tool and the Pathfinder, but have had no luck yet.

    2.) since these forms serve the page, is it possible to ensure that they are as a group really centered? I tried their balance to the artboard, but it didn't look right. So far, only visually focusing is best for them. Maybe it's better this way but wanted to check.

    (3.) when I tried to align vertically the two forms to each other on the top line and the bottom, it doesn't do anything I do it (align to Center, low or high). It is always disabled. And I do track who has always worked in favor of something like that, by aligning to Center vertically and choosing align to selection. What is going on?

    Thanks a lot for your help! Greatly appreciated.

    fiddlehead_stamp_3.png

    If you need to use transparent instead of shades, you could put the strokes on a separate layer and apply the settings of opacity for this layer and not to unique objects.

  • By aligning problems in CS3

    I have problems Kaleidoscope anything in CS3. I can align objects with each other, but if I just want something centered in the area of harvest he will do nothing. I changed it back and forth between the area of culture and art Board and nothing happens anyway. I know you can do this in CS2, but since I got CS3 there is a problem. Any advice would be helpful. Thank you!

    You must not only choose the option, but then also activate it by clicking on this button with the icon

  • Region alignment problems

    4.2.1

    THM: 2

    Hello world

    I had a question about the "new column" option when setting up of regions horizontally. I created an example here

    1. I am not able to reproduce here, but report 1 and 2 If the application has data with higher values, jumping around, I don't know how to respond, but basically, I tried to fix the width of the two reports as they do not horizontally expand depending on the length of column report. Is this possible?  I tried the following in the attributes of the region - style = ' width: 600px; float: center; Clear: none; "While this works, hardcode the origin of the problem in the second point.

    2. I want to center align the region 15 of html.  However, one thing I noticed is that if I set the width of the report 1 and 2 report of a coded hard and then region html 15 value behaves differently in different resolutions, on 1440, it is centered properly with all the elements in this center aligned, however, on a monitor resolution 1600 or 1910, it is pushed to the right side. When I hit the option to see the grid. I noticed there is another grid or column that is created on a higher resolution screen between report 1 and html region 15. This does not happen on a 1400 resolution screen. So the question is perhaps hardcode.

    Basic idea is to have all the three regions of fixed width such that they expand 'horizontal' and html region 15 is centered with everything centered.

    Thank you!

    ryansun wrote:

    I think that the best cases like you said that the two reports extend horizontally based on the resolution of the screen.

    Yes, I thought that was the easiest approach, and I set up in a new page in your demo application.

    I started by simplifying what was to get rid of everything that touched the spacing or available other than the layout region table. It was to drop or modify models of the region which introduce spacing through CSS margins, borders, or padding.

    Then, I created a region containing relatives and made the report and the regions sub-regions of the present button. All models of the region in theme 2 have CSS padding applied, so to avoid this problem, I added a model of area small to use for the container area (Model No. cannot be used because we need a selectable container for use as the target of CSS.)

    After that, it is simply to use CSS to develop the container and its content to the width full page and align the Center area, horizontally and vertically:

    /*
      All of the tab navigation enabled page templates in this theme include sidebars.
      These are not required here, so suppress them to eliminate unwanted padding
      artifacts from the layout.
    */
    td.tbl-sidebar {
      display: none;
    }
    /*
      Set the width of the parent region...
    */
    #container {
      width: 100%;
    }
    /*
      ...and its region layout to the width of the page, and eliminate table cell spacing
      from the region layout table.
    */
    #container .regionlayout {
      width: 100%;
      border-collapse: collapse;
    }
    /*
      Eliminate table cell padding from the region layout table.
    */
    #container .regionlayout>tbody>tr>td {
      padding: 0;
    }
    /*
      Set the width of the report cells on each side to 45% of the page width.
    */
    #container .regionlayout>tbody>tr>td:first-child,
    #container .regionlayout>tbody>tr>td:last-child  {
      width: 45%;
    }
    /*
      Set the width of the center button region to 10% of the page width.
    */
    #container .regionlayout>tbody>tr>td:nth-child(2)  {
      width: 10%;
    }
    /*
      Horizontally and vertically center the button region within the region layout cell.
    */
    #container .regionlayout>tbody>tr>td:nth-child(2)>table  {
      margin: 0 auto;
      vertical-align: middle;
    }
    /*
      Expand the width of the reports to the width of their container cells.
    */
    #container .regionlayout div[id$="_catch"]>table,
    #container .regionlayout .report-standard {
      width: 100%;
    }
    .report-standard td {
      vertical-align: top;
    }
    

    A number of things may need further work. As the parts of the report are now configured No. Template, no titles are displayed. If the securities are necessary, the best way to display will probably use another custom area template to avoid the fill applied to built-in ones. The white background and content minimum paging at the end of the relationship line affects the Visual Center in the vertical axis, causing the position of the region of middle button seem to be too low. This can be solved by removing the paging if reports don't require it, or style of the paging line to have the same background color as the rest of the report.

  • Pinning and align problem - working with alternative configurations fixed and fluid

    Hello

    As suggested by the staff of Adobe, I'm working with a layout of fixed width for the desktop version, so I can use the scrolling effects in this version and a layout alternative tablet with a fluid design for mobile devices.

    In this way, I will have two major problems with the working fluid design version:

    -I can't pin objects to fixed locations in the browser. The option is disabled, and I can't create a set menu, for example.

    -I can't focus the presentation of the fluid design version, there's always left align. In fact, breakpoint rule changes and stays aligned left also. It is a problem, because when I opened my site in a device with a larger resolution, it remains to the left of the browser.

    There is a solution for these problems?

    Hey well thanks for the help, Bernard.

    I tried to work with a fluid layout compressed as an alternative to avoid creating a Tablet and the mobile version of the site. Instead, I would have only the office page and the layout fluid compressed, that would suit regardless of the user's device.

    As for now, I will continue to work with the development of Adaptive with variants of the tree when scroll effects are necessary and work with a sensitive provision in other cases, with more correct is.

  • Inference of object with other objects or alignment Center page.

    Is someone can you please tell me how I throw inference guides that highlight when I move an object on the page are centered vertically or horizontally, or in line with other objects. I mean, I want to be able to move objects such as spaces for images and text around frames on my pages and have the alignment guides appear when objects are centered page or in accordance with other objects. It seemed to work when I started experimenting InDesign, but seems to have stopped working in the last day or two, probably because of something I did!

    Little assistance of love!

    Scotty

    I think you want to say "bearings commented. You can adjust in the InDesign preferences. Here is the tutorial of Sandee Cohen on them: http://creativepro.com/align-and-space-objects-indesigns-smart-guides/

  • Race alignment problem

    It is an odd. When I have a 1 pt STROKE and try to align it inside or outside, Illustrator shifts the trait in a strange way. (See the picture of the three States: centered, inside and outside.) However, there is a work around which I first determine the race of 2pt and align it as I want, and then change back to 1 point race and behavior is as expected.

    For something as simple as align a line by 1 point, it seems strange to have to resort to a workaround. Does anyone else have this problem? If so, how can it be addressed?

    illustrator-stroke-problem.jpg

    Disable all instances of the disease to align it on the pixel grid (see Panel processing) and try again.

  • Centering Flash problem?

    Hello

    I'm trying to FOCUS my flash when it is published.  I went for the publication settings and selected Center where I can.  I even edited the HTML template that is not refunded to < CENTER > < / CENTER > around any flash. If I view the source, I can see the command Center... but the default flash always to the left. Is there another solution I suppose to set?

    I downloaded two files... one is the model of House who calls the other page 1 of model so that you can maybe tell me what I need to adjust so that it can be centered. Due to the size didn't upload the .swf files, so you will need to post them to see how they align to the left.    I've never had this problem... normally the HTML takes care of it?

    THANK YOU FOR ALL SUGGESTIONS/HELP

    put these tags Center just inside the body tags horizontally Center flash content.

  • Another text alignment problem

    Dear friends,

    I've got this div which compensates for a left on my page and stacked column that is, I have some images with captions under. Now, my problem is: I want to center alignment within this div but the text images, I need to justify themselves and what is happening is that if style the div > box to center the text gets as well centered. I tried to create a new style class for the text-only, but the div style overules it. What should I do?

    p-s: it's DW CS4 I use now (for the worse)

    Thanks a lot for your help

    JV

    Try this:

    In your left div, create a list of definitions with an alternation of DTs and DDs.  Put each image in the DT tag and each caption in the corresponding DL tag.  As follows:

    Legend here

    Legend here

    Legend here

    And then use this css:

    DL {text-align: center}
    DT {margin-bottom: 4px ;}}
    DD {margin: 22px 0 0 0; padding: 0; text-align: justify ;}}
    IMG {border: 0 ;}}

    That should do it.  Otherwise, we'll see a url for your page with this code on this issue and we will sort.

    --

    E. Michael Brandt
    
    www.divahtml.comwww.divahtml.com/products/scripts_dreamweaver_extensions.phpStandards-compliant scripts and Dreamweaver Extensions
    
    www.valleywebdesigns.com/vwd_Vdw.aspJustSo PictureWindowJustSo PhotoAlbum, et alia
    
    --
    
  • Inkjet e: 5740 5740 printer does not print color cyan &amp; alignment problem

    Hello

    Recently, I replaced my lights on my P 5740 printer ink cartridge while trying once photograpgh print [6 x 4] & have had nothing more than headaches since.

    The cyan color does not print ink levels indicate that it is used. I cleaned the heads of ink at level 3. I have replaced the ink cartridge & still have the same problem and now the alignment is unsuccessful.

    I'm challenged to begin with technology & this challenge is both frustrating and disappointing that I do not understand what I did right.

    Any suggestions before I have packing the printer & return to Staples?

    Thank you

    HI @RC23,

    Because the printer is only a couple of months I suggest to HP customer care and ask about a replacement printer. Most likely, it is a matter of ink system, since you've already tried another cartridge with the same results. Check the model number and the form to receive a file number for faster assistance.

    Thank you!

  • HP D4360 printer - alignment problem?

    My watch of the half cut letters (upper half), Headline is not yet printed on the page, a clear text than the rest of the text,

    white line crosses SOME of the lines of text, page #s top (right) not printed.

    Note: I have a new cartridge it works fine.

    Note: I had a paper jam the other day, out of paper on the other side (did not know that I should open a backdoor to do). But, I

    think I got an OK impression after that happened.  Today, printing problems. Help please!

    It's sunshyn2005 - thank you for your information. In fact, it is not a matter of color.  It was really the alignment.  I received instruction from someone on the spot - to go to start/printers-devices/preferences/services/then click the ALIGNMENT tab, which produced a sheet printed diagnostic, I then completed in the screen.  Had to re - align 3 times to get it perfect, but it worked.

    Thanks for your suggestion, the page that came on the colors and other things I have bookmark for playback if/when other problems arise.

    Thanks for your comments.

    TriciaJoy

Maybe you are looking for