centering and right alignment in div even

New buttons css and attemptint to Center a logo in a < div > tag while the right aligning the contact/shopping cart. No combination of relative, absolute or fixed positioning seems to work. The two elements seem to be 'glued' together. The page is here: http://www.demilodesign.com/assets/CSS/nav.html

Thanks for the suggestions.

My css is:

.logo

{background-color: #F6FDDB;}

Width: 100%;

height: 46px;

border-bottom-style: solid;

border-bottom-color: #cccc66;

border-bottom-width: 1px;

text-align: center;

position: relative;

Top: 0px;

padding-top: 11px;

padding-bottom: 12px;

}

{.contactCart}

position: relative;

padding-right: 70px;

text-align: right;

padding-top: 40px;

}

and my html code:

< div class = "logo" >

" < span > < a href =" http://www.demilodesign.com "> < img src = ' http://www.demilodesign.com/assets/images/logo.gif "> < / a > .

</span >

" < span class ="contactCart"> < a href =" http://www.demilodesign.com "> < img src = ' http://www.demilodesign.com/assets/images/contact.gif "> < / a > .

" < a href =" http://www.demilodesign.com "> Contact < /a > < a href =" http://www.demilodesign.com "> < img src = ' http://www.demilodesign.com/assets/images/contact.gif "> < / a > .

" < a href =" http://www.demilodesign.com "> < /a > basket .

</span >

< / div >

Modify the HTML code to

and add/edit the CSS

. Heading .logo img {}

display: block;

margin: auto;

}

. Heading .contactCart {}

position: static;

Width: 200px;

float: right;

margin-top:-80px;

}

. Heading .contactCart a {}

display: inline-block;

}

Tags: Dreamweaver

Similar Questions

  • Centered and left aligned text

    I have several blocks of text that contain paragraphs 2 or 3. Paragraphs should be aligned to the left. However, they must also be centered horizontally in their respective text frames (as in the example on the right in the picture below). Each set of paragraphs has different lengths, so it would be tedious to have to change the withdrawal on each of them or to change the tabs for each group.

    Is it possible to do without having to manually position each in InDesign CS4?

    Untitled-1.gif

    Jay fresno wrote:

    Peter,

    A table is a great idea. However, I don't think it will work in this case because of other considerations of page layout. I do a provision which consists of frames and text frames. Each photo frame and text block are grouped. On each page, I plan to have a large text frame that contains several groups of executives and executives of text. In the image below, there are 9 groups within a single text block. Large text frames that contain all groups spend another frame of large text on the next page, which also contains group photo series and blocks of text.

    The reason for such a provision is so that a user can insert a new picture/text frame group and all other groups will automatically move to the right. Or, if a group is deleted, all other groups will move to the left.

    On some pages, there will be a different presentation with a significant group in the lower part of the page (as in the lower image). Currently, in the bottom image, there are 3 groups in the top row, and there is only one group in the bottom row that contains 3 sets of groups of photo/image.

    I'm really struggling with this provision. How text aligns is a secondary factor. The main challenge is to know how make it easy for the user to insert and remove groups of photo/text frames, so that all groups take as they should.

    I hope I described it is understandable. I am open to any suggestions that will make this easier to use layout.

    Hi, Jay:

    Images are worth zillions of words, do you not hear?

    I'm not a designer or page layout production guy, so I'm just speculating. If I understand your need to add or remove one or more items from image caption / and I have to fill in other, horizontal threaded frames can operate. For the first page, three horizontal frames, threaded top-right to the center-left, middle, right to bottom-left. Remove any unit and other return flows; Add the entire building and other flows forward - you need for Smart Text Reflow is flowing to a new page.

    Something similar might work for the second presentation page.

    HTH

    Kind regards

    Peter

    _______________________

    Peter gold

    Know-how ProServices

  • Right aligned and then centered in the cell of the table - indesign cs 5

    Hi all

    Does anyone know how can I get the numbers right aligned, so the zeros are all below the other. And then the center of the table cell.

    I use a paragraph style is aligned to the right. This is the paragraph defining the cell style.

    Any help would be appreciated.

    Thank you

    Mau

    InDesign CS5

    You can set the position of the tab within the paragraph style, so no, you do not need to edit each cell, but you do not have to use the text aligned to the left, and if you want that all the place line numbers correctly you need to use a font with tabular, rather than numbers proportional to make them all the same width (and for tables rather than oldstyle figures is probably also a better choice).

    When you look at the tabs formatting options that you have left, right, centered and aligned decimals (which can be any character of your choice, but you want the period). When you use the decimal tab aligned, everything you type will behave as if the tab is a tab that is aligned to the right - it will start at the position of the tab and move to the left with each additional character - until you type the character that you chose for the alignment. From there text will move to the right of the alignment. This aims to make things like the columns of numbers with decimals.

    In a table, the tab character is implied, so if the only thing in the cell is your setting of the tab in the style number is sufficient and it will work just as soon as you start typing. If there is other text before alignment numbers that must be the left hard, however, you will need to type, then manually insert a tab in the menu Insert special characters (or create a new shortcut key to insert tabs in tables) to force the text to the left margin and keep the numbers aligned on the decimal point. You can't just hit tab within a cell to add the tab - it reports ID to pass to the next cell.

  • Justify the Divs to the left and right of the page with the gaps between the two. Possible?

    I have 4 eponymous divs with different images and rollover Javascript on them, spread horizontally on my page effects.

    I'm trying to align their so there are gaps between each div, but NO space on the right and left side, so that they are tight to the edge. If I put a margin on the right side of 5px, for example, the div right hand still has a gap of 5px, otherwise he's going on the next line.

    Of course, I can make a new rule for the div of the right hand with no margin to the right, but this will make more complex Javascript code with perform effect hover on two types of divs.

    Is it possible to pin the divs to the left and right of the page with an 'auto' margins inbetween them?

    Untitled.jpg

    I found a solution in any case. I've adjusted to the width of the div so that they coincide closely each side. Then align the images (HTML) 'Left, middle, Hugo, right' so that they are tight against each side and have differences even between them. If all goes well, there is no flaws with this method, it seems to work pretty well.

  • How to position my tag div with top, bottom, left and right attributes?

    So I have my background image and then I want only the sides to display so I put my div tag in the Center and does it extend to the edges of the top and bottom of the page, then theres a little bit of the background image on the sides of the white div. Than perfect, but when I focus I had to remove the position attribute. Now, I can not use the up, down, left and right attributes.

    OLD CODE WITHOUT A CENTER:

    {#whitediv}

    position: absolute;

    Top: 0px;

    Width: 930px;

    height: 100%;

    z-index: 1;

    background-color: #FFF;

    }

    NEW CODE WITH CENTER POSITION BUT CANT IT:

    {#whitediv}

    position:;

    Top: 0px;

    margin: 0px auto;

    Width: 930px;

    height: 100%;

    z-index: 1;

    background-color: #FFF;

    }

    To Center elements with CSS, you need 4 basic things.

    1. A document type is valid,
    2. width in pixels, % or ems, container
    3. a margin left and right of the automobile,
    4. default positioning (static or not specified).

    For example, the following page has a centered division.

    http://ALT-Web.com/test/resizable-BG.shtml

    The background image is applied to the CSS body selector.

    / * DIV CENTERED * /.

    {#page online purchase

    Width: 70%;
    margin: 5th auto;
    Padding: 3em;
    background: rgba (0,0,0, 0.70);
    color: #FFF;
    }

    Nancy O.

  • 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.

  • One sheet Style Div even and different style on different Pages

    QUESTION:  How to use the same stylesheet at the same tag div with a different style of style on HTML pages?

    BACKGROUND:  Below you will find the HTML and CSS code for a div tag that has the same name in four different HTML pages.  The CSS specifications for the div even on every page should differ only by the width of the div.  My goal was to create a CSS rule for everything but width and four additional rules to control only the width of the label on each different page.  I failed.  I have to repeat all the content in the div leftColumn four times?

    CODE (HTML):

    PAGE 1: < div id = "left column" class "Hashi" > < / div >

    SECOND PAGE: < div id = "left column" class "Mori" > < / div >

    PAGE 3: < div id = "left column" class "Iwai" > < / div >

    PAGE 4: < div id = "left column" class "Hito" > < / div >

    (CSS) CODE:

    div #leftColumn {}

    float: left;

    padding: 2em 1em 1em 2em;

    text-align: center;

    }

    div. Hashi {}

    width: 9è;

    }

    div. Mori {}

    width: 25em;

    }

    div. IWA {}

    Width: 9è;

    }

    div. Hito {}

    Width: 9è;

    }

    Roddy

    kiusau wrote:

    This statement means that when a class is tight (no space) assigned to a specific HTML tag, that it cannot be reused to describe the appearance of another HTML tag?

    # You can use selectors as often as you want in a style sheet. The waterfall all adds up and applies it to the page, solve all conflicts, if any.

  • Last night suddenly when I right click view image in firefox, they appear centered and on a black background. He is generally meant to be a white background and the image that appears at the top left. How to get back to it?

    I have a problem with something in firefox, it is quite minor, but still bothers me. Last night suddenly when I right click view image in firefox, they appear centered and on a black background. He is generally meant to be a white background and the image that appears at the top left. I don't remember what I did to change this if it's my fault; If anyone knows how to get back to it, I would be grateful.

    This is the new behavior in Firefox 11.

    See also:

  • I have Acrobat Pro on my computer and I work with the drawing that have been digitized in PDF format. The scanners are not aligned or place because of the poor scanning process. Anyway is to align the document even if it requires me to crop or lose

    I have Acrobat Pro on my computer and I work with the drawing that have been digitized in PDF format. The scanners are not aligned or place because of the poor scanning process. Is there anyway to align the document even if it requires me to crop or lose some on the edges?

    Hi brad.

    Yes. You can use the analysis tools to straighten and crop your document. Here is a link to a new tutorial. The key to activate the sliding options recovery is to choose the option of the camera Image in the drop to Enhance, and gives you tools to set the correct page for smoothing areas.

    fundamental https://helpx.adobe.com/Acrobat/How-to/scan-Paper-documents-Searchable-PDF.html?Set=Acroba--principes t - create a pdf file

    Donna.

  • Problems with left and right Divs

    Hello, I have returned, to see if everything is OK if I could receive assistance with the same subject that I posted previously that came to no conclusion. I try to have two div to the left and right of eachother, which automatically stop the footer. Here are my problems with the following code:

    1. for some reason, the left div is located in the upper left and right div located on the lower right corner

    2. the divs do not automatically stop at the foot of page and corresponds to the amount of pixels in "min-height".

    Demo page: http://www.expertpcguides.com/web-contributors.html

    Paste the following code in my .css document

    #left {}

    Clear: both;

    Background: url ('www.expertpcguides.com/mg/Left.jpeg');

    min-height: 610px;

    Width: 150px;

    float: left;

    }

    #right {}

    Clear: both;

    Background: url ('www.expertpcguides.com/img/Right.jpeg');

    min-height: 610px;

    Width: 150px;

    float: right;

    }

    Paste the following code in my html document

    "<div id="left">< /div > .

    "<div id="right"> < / div > .

    Infact to reach the boxes of such height you'll probably have to use display: table;

    This means wrap any 'left', 'boxcontent', 'good' section in another

    :

    Then, using css:

    {#displayTable}

    Display: table;

    }

    #left {}

    Background: url ("http://www.expertpcguides.com/img/Left.jpeg");

    Display: table-cell;

    Width: 12%;

    }

    #right {}

    Background: url ("http://www.expertpcguides.com/img/Right.jpeg");

    Display: table-cell;

    Width: 12%;

    }

    #boxcontent

    {

    Width: 76%;

    Display: table-cell;

    padding: 30px 25px;

    }

  • Need help to align right &lt; ul &gt; relatively div container

    Hi guys,.

    I'm trying to get an unordered list to display "right: 0; ' relative to the div container that it is in.

    When I put the value of the unordered list to "right: 0; ' it makes the < ul > go to the far right of the screen, but I want to just go to the far right of the div that it is in.

    I tried this:

    #header div.headerContainer ul.nw {}

    margin: 0px;

    position: absolute;

    right: 0px;

    }

    Does anyone know where I could go wrong?

    Click here to see my test site, is that the help and the list not ordered, I try to go to the far right of the div is 'sn '.

    I'd appreciate any help, you can give and hope to hear from you.

    SM

    I can see your page now, but I can't work all that is your problem.

    The other thing to say is that if you use absolute position on an item from the container element, you need to add position: relative to the container.  However, it is advisable to avoid the absolute position if you can.

    Martin

  • Master page align left and right online

    Hi guys,.

    How can I do to have a line that is the same line in the master page where the title aligned to the left and right page number?

    Here is my real sample

    1.png

    Here's what I want to achieve

    3.png

    I tried with tabs, but I'm not sure it will work when the number is in double figures. Sorry for the newbie question.

    See you soon,.
    S

    Hello

    Of course, you can use tab. It will work. This solve the alignment of a paragraph left or left justify and use the tab right alignment (use appropriate tab position value) or giving Shift + tab (tab of withdrawal right) before the page number it it line up right.

    Thank you

    Green4ever

  • By aligning the Divs 0 top left and 0

    I was struggling with this simple question for some time.  The first Div is not high or absolute absolute left-aligned.  Am I missing something?  I'm building a large site of scrolling.  Currently using apDivs which works well for me, but in principle I feel defeated I can't do it with Divs flow and document without this little top and left of a div. regular gap

    I know I will kick myself when someone tells me the answer - I watched all I can think of--forcing the borders, margins and padding to 0 etc.

    Zero out the default margin and padding on the 'body' tag as below:
    
    body {background-color: #C6F;margin: 0;padding: 0;}
    
    Many tags have default margins that may require zeroing out to achieve the correct effect 
    
  • In the design of the text alignment jumps around, even when the value "align top".

    Hi all

    I worked in a pamphlet that someone else created, and I have a problem with the text boxes. No matter what I set the alignment (align the top, in this case), it jumps around whenever I move the text box. For example, I try to move the box to the top, and the text inside it moves down. I move the box to the top, "centered" the text becomes. In fact, when he arrives at the margin, he's going above it all. The text inside the box is located just to the right of the margin, even though the box itself moves upward. The principal is also greater than it should be. When I take the text box on the page completely and put it next to the document, the leader returns to normal and it is aligned to the top.

    Clues?

    Thank you
    Trina

    Your text is set to "Snap to grid".

  • How to right-align the inputText with readOnly = "true"?

    Hi all!

    I use jDev 12.1.2.0.0

    I have an af:inputText inside a panelFormLayout. I want the inputText propped right and so I added this tag:

    contentStyle = "" text-align: right; "." So far so good.

    When I do the inputText readOnly = "true" then the contentStyle is ignored and the text is left-aligned.

    If I use the "disabled" instead of readyOnly property, the issue is resolved, but I can't use actually "disabled" property because the field must be able to recalculate from changes in other areas.

    I read this right align text problems , but still I can not know what to do.

    Any help is welcome!

    Thank you very much

    ~ apostolos

    Hello

    Can you explain this?

    > If I use the "disabled" instead of readyOnly property, the issue is resolved, but I can't use actually "disabled" property because the field must be able to recalculate from changes in other areas.

    Re-calculation / ppr has nothing to do with real estate handicapped. The field will be get updated automatically (even when it's read-only / disabled), when the partialTriggers are added correctly.

    Arun-

Maybe you are looking for