Need help with the text in a presentation liquid

Hello Adobe Forum,

I'm trying for the first time how to build a liquid diagram. I have now works, but I would like to have is a liquid layout in another. I want my #wrapper to always be flexible, as if it were present, as well as the text of p #content to have a width 'fixed' to say 500px, but also flexible, but only if the screen is smaller than the 500px.

I use the code from Rachel Andrew CSS Anthology. Its for a presentation of 2 columns but I just need some kind I played a bit with. At one point, I got the text of work how I wanted but played a little more and I forgot what the tag actually did it

I have to say that it is for a mobile device if you're wondering why I design this way

I can't post a URL but my code is below. Thanks in advance

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Liquid Layout Test Site</title>

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

</head>

<body>

<div id="wrapper">

<div id="content">

<h1>Welcome</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin non mi in urna hendrerit tincidunt. Maecenas eleifend erat et lacus. Sed tempor. Sed venenatis consequat neque. Sed massa. Donec quis orci sed lacus ullamcorper venenatis. Nam et sapien. Sed id dolor in tortor eleifend aliquam. Mauris vulputate. Nulla nec diam et pede faucibus ornare.</p>

<p>Vestibulum dictum massa at odio. In dignissim ante id dui. Morbi rhoncus elit ac ipsum. Curabitur a elit. Phasellus in lorem quis turpis imperdiet accumsan. Suspendisse potenti. Curabitur a enim sed lacus tempor venenatis. Mauris sed ipsum sit amet leo dictum scelerisque. Suspendisse a lectus. Aliquam nec felis at erat sagittis pretium. Nunc id augue pharetra augue commodo tincidunt. Praesent placerat, diam quis porttitor lobortis, orci arcu nonummy sapien, at venenatis ipsum wisi non wisi. Sed bibendum nunc at justo. Vestibulum leo lacus, lobortis vel, interdum ac, varius non, augue. Nam rhoncus dictum libero. Donec porttitor porta lectus. Vivamus consectetuer feugiat wisi. Morbi sit amet nibh eget nibh feugiat porttitor.</p>

</div> <!-- content -->

</div> <!-- wrapper -->

<!--<div id="nav">

<ul>
  <li><a href="#">Link 1</a></li>
  <li><a href="#">Link 2</a></li>
  <li><a href="#">Link 3</a></li>
  <li><a href="#">Link 4</a></li>
  <li><a href="#">Link 5</a></li>
</ul>

<h2>H2 Header</h2>

<ul>
  <li><a href="#">Link 6</a></li>
  <li><a href="#">Link 7</a></li>
  <li><a href="#">Link 8</a></li>
  <li><a href="#">Link 9</a></li>
</ul>

</div>  nav -->

<div id="footer">

<img src="images/Huntington-logo.gif" width="300" height="62" alt="Huntington Logo" />


</div>
<!-- footer -->

</body>
</html>


/* CSS Document */
 
body {
margin: 0;
padding: 0;
background-color: #d6ddb3;
color: #000000;
font-family: Arial, Helvetica, sans-serif;
border-top: 2px solid # 2A4F6F;
}
 
#header {
border-bottom: 3px solid #B2BCC6;
height: 0.5em;
}
 
#header .strapline {
font: 120% Georgia, "Times New Roman", Times, serif;
color: #778899;
background-color: transparent;
float: right;
width: 300px;
text-align: right;
margin-right: 2em;
margin-top: 0.5em;
}
 
#header .logo {
float: left;
width: 300px;
margin-left: 1.5em;
margin-top: 0.5em;
}
 
 
 
#wrapper {
margin-left: 1em;
margin-right: 2em;
margin-top:2em;
background-color:#FFF;
}
 
h1 {
font: 150% Georgia, "Times New Roman", Times, serif;
color: #5c5b5b;
}
 
#content {
background-color:#CCC;
 
}
 
#content p {
font-size: 0.9em;
line-height: 1.6em;
padding-left:10px;
padding-right:10px;
}
 
#footer {
border-top: 2px solid #778899;
position:absolute;
bottom:0;
}
 
#footer img {
margin-left: auto;
margin-right: auto;
padding-top:0.5em;
padding-bottom:0.5em;
}
 
#logo_center {
margin-left:auto;
margin-right:auto;
}
 


Hello

You can apply one - max-width: 500px; -, in this way it will not go above this when seen on the larger screens (remember to remove the rule of "fixed" width).

PZ

Tags: Dreamweaver

Similar Questions

  • Need help with the text variables

    I have a directory to which is more than 300 pages long.

    Each entry begins with a photo in a built-in framework shaped like a cat fall, followed by a space en dash and then the name, company, address, e-mail, etc.. Essentially, we have a photo hanging to the left and on the right information.

    The name is the last name in capital letters, first name and middle name propercase. I've defined a character style "Dict Head" and used in a paragraph style as style nested through 3 characters.

    Then, I defined a two text for the instance variable first and last instance on the page of the character style "Dict Head". I have a hyphen between the two variables (the goal is at the head of the race be "AAR - ABE," for example). The application, however, includes space en with three letters.

    I did a GREP search for space en with the applied character style and replaced it with himself, and < None > character style applied and which does not seem to get rid of. My current title looks like this " AAR - ABE." With invisible on I see the en space is still there.

    I deleted the text variables, exported a. File INX, opened soft and recreated the text variables and the spaces are still there.

    I'm open to suggestion.

    Ken

    It seems ID brings together up to three regular characters with which nesting style... (Okay - just tried and the original en-space is also considered to be a 'character' for this number of three.) No matter what... read more, please)

    You can not delete a character with your search and replace nested style. Try it - ID can be found but not change it to [anything].

    Possible workaround would be to not use the style nested to mark the names and put the character marker using a GREP search and replacement style.

  • Need help with the installation of an adapter of Palit GeForce 9500GT Super chart - 512 MB in a M2N68 (narrated

    Need help with the installation of an adapter of graphics Super Palit GeForce 9500GT - 512 MB - DDR2 SDRAM in a M2N68 motherboard (narra6). Should I disable the onboard graphics in the bios? When the card is installed, no VGA work outs and the PC does not start. Checked and recontroler implementation of the card in the PCI slot. PC is a desktop HP G5200uk PC. Windows 7 operating system.

    Hello

    The link below is a guige to install a video card in your Pc.  In particular, it seems that you will have to perhaps specify the location of the new card in the bios and save this change before you install the new card - see step 4 in the guide on the link below.  If your new card fits into the PCI Express x 16 slot, you will need to define PCI Express in the bios and save the changes.

    http://support.HP.com/us-en/document/c01700855

    Kind regards

    DP - K

  • I need help with the program of Photos on my macbook pro

    I use a Macbook Pro with OS of Yosemite. I really need help with the Photo program. I never really got the hang of IPhoto and now that it's a new program, I'm really confused. Where can I go to learn this without waiting for the next workshop in a local store?

    Hi, I'm fighting to open same mine, making a new software update

  • Need help with the launching track pack for forza code 4

    Bought new Forza 4 and the lancer Track Pack code does not work, how do I get a code that is generated in the form I've already paid for it. Rank of loads of numbers and sent 10 s of emails but cant seem to get help.

    This is the help I get when the cat to an Ambassador xbox on xbox.com

    Terry wrote:
    Need help with the launching track pack for forza code 4
    The Xbox Ambassador says:
    Location of Ambassador of the community...
    The Xbox Ambassador says:
    Location of Ambassador of the community...
    The Xbox Ambassador says:
    Your question will be answered by an Ambassador of the Xbox. You have been connected to the Ambassador as a user Xbox [3]
    The Xbox Ambassador says:
    Hello
    Terry wrote:
    Hello
    The Xbox Ambassador says:
    Hey
    Terry wrote:
    just to be on the phone to xbox live support and was told to come here
    The Xbox Ambassador says:
    ok\
    The Xbox Ambassador says:
    What is your problem?
    Terry wrote:
    I bought the 4 for forza ansd 360 new sealed Christmas...
    Terry wrote:
    has got 2 codes that accompanies the game but the pack track code does not work
    The Xbox Ambassador says:
    Wow good
    Terry wrote:
    whenever I put in the code it says code redeemed
    The Xbox Ambassador says:
    I think the code is used. You must return to the retailer
    Terry wrote:
    I tried to, but since I already opened the case they will not accept
    The Xbox Ambassador says:
    Oh. No,
    Terry wrote:
    the code had been used or defective as I am the only person who has touched the game once opened, tried to enter the code when it is open
    The Xbox Ambassador says:
    Maybe it was auto bought?
    Terry wrote:
    so, how do I get another code generated track Pack if defective?
    The Xbox Ambassador says:
    I do not know.
    Terry wrote:
    bought the game new, so I get the track pack
    The Xbox Ambassador says:
    Oh. It's bad.
    The Xbox Ambassador says:
    I think that if you Exchange 1 code it will buy it
    Terry wrote:
    car pack code worked, starter pack did not work
    The Xbox Ambassador says:
    Oh.
    The Xbox Ambassador says:
    It's a bad
    The Xbox Ambassador says:
    BTW you have an evolution of the tests?
    Terry wrote:
    Yes, I want to? but more anxious to get a code object generated for this pack
    The Xbox Ambassador says:
    Hey if I help can u give me this game too?
    Terry wrote:
    ?????????????????
    Terry wrote:
    So is it possible to get a code for that time?
    The Xbox Ambassador says:
    Hey
    The Xbox Ambassador says:
    Yes.
    The Xbox Ambassador says:
    you need to contact them
    The Xbox Ambassador says:
    and tell them that the code is used.
    Terry wrote:
    I was told to come here? where can I go to get the code?

    Hi Terryg76,

    ·         What version of the operating system is installed on the computer?

    I suggest you to contact the game manufacturer for more help and information.

  • Need help with the blue screen issue "NAVEXI5. SYS, PAGE_FAULT_IN_NONPAGED_AREA ".

    Original title: need help with the blue screen issue
    My computer turns saying a blue screen: a problem has been detected and windows were shut down to prevent damage. The problem seems to be caused by the following file: NAVEXI5. SYS PAGE_FAULT_IN_NONPAGED_AREA he seems to have a different error whenever he turns to a blue screen. Can someone help me please.

    Hello

    1. Since when are you facing this problem?
    2. you remember to make changes to the system?
    3. do you get an error with this error code?

    I suggest to unplug external devices such as printer, scanner, etc. that are plugged into the system, and then restart the system and check if the problem persists.

    Method 1.
    I suggest you to do a check disk from the recovery console and check if the problem is resolved. Follow the steps mentioned below.
    a. start into the recovery console using the XP CD. Follow the steps mentioned in the article below.
    Description of the Windows XP Recovery Console for advanced users
    http://support.Microsoft.com/kb/314058
    b. perform a disk check.
    How to perform disk error checking in Windows XP
    http://support.Microsoft.com/kb/315265

    Method 2.
    I suggest you to start with the XP CD and then do a system restore. Follow the steps mentioned in the article below.
    How do I recover from a corrupted registry that prevents Windows XP startup
    http://support.Microsoft.com/kb/307545

    I hope this helps.

  • Need help with the IP configuration on vm ware for the installation of 11 GR 2 on linux vmware 6 on win7

    Need help with the ip configuration on/etc/hosts for the installation of 11 GR 2 on linux vmware 6 on win7.

    Let me know if you need more info... in fact I have a setting error while installation said

    -(/ etc/hosts has no correct entry for the host name)

    Host: 192.168.85.100

    Win7 ip: 192.168.1.x

    Thank you...

    (host computer)

    Win7 64 bit

    (vmware)

    Oracle Linux Server 6.3 version

    Release of Red Hat Enterprise Linux Server 6.3 (Santiago)

    Oracle Linux Server 6.3 version

    -(/ etc/hosts has no correct entry for the host name)

    Then post your/etc/hosts.

    Host: 192.168.85.100

    Win7 ip: 192.168.1.x

    Why 85? have you tried 192.168.1.100?

  • I'm on Acrobat 10 and I need help with the distribution of shape feature. Is there a way to change the registration e-mail download addressed to the? Currently all forms I create and then distribute may only be subjected to my email account... I appreciat

    I'm on Acrobat 10 for mac and I need help with the distribution of shape feature. Is there a way to change the registration e-mail download addressed to the? Currently all forms I create and then distribute may only be subjected to my email account... I appreciate any help!

    Do not use the feature distribute the form. Instead of this, just put up a button "submit" and configure it to send email using any email address you want. Just add a button and set the action of the mouse upward on "Submit a form" and use a type mailto URL and specify that you want to send the full PDF. Then activate the reader of the document: where "Advanced/extended features in Adobe Reader" is located in Acrobat XI?

    If you really want to use distribute the form for some reason, change the e-mail address in your preferences: Edit > Preferences > identity > Email address

  • Hello need help with the opacity mask.

    Hello need help with the opacity mask. I hope someone out there can help

    I inherited a logo that appears to use a Logo of OM has a shape with a grad. This grad at first sight is not used in the Grad scheme and there is not editable.  Looking at the transparency palette I find an OM (pic1) output option. If I choose what the grad on separates it from the page of the form, that is from there I can change/remove as required (Note2).

    However, sometimes (he did no change), I'll be back to the same original form and output option is grayed out and is no longer available. Or I go to the similar shape that has the same treatment and I can't go out OM (pic3)

    The only difference is the thumbnail in the transparency palette, which is strong in pic1 and rated on pic3. What Miss me?    I'm not clear what the advantage is simply OM using the Grad palette to apply a grad in my form, but until I can get rid of OM who is there, I can't comfortably apply to the grad I want.

    The white gradient LHS I have no problem with. I choose fortunately only and each time get the possibility of release of OM.

    Screen Shot 2015-08-06 at 12.26.48.pngScreen Shot 2015-08-06 at 12.00.10.pngScreen Shot 2015-08-06 at 12.01.16.png

    The other thing weird. When I select the white gradient. Sometimes, the exit option is in the palette without going through the drop-down list (Fig 4).

    Other times seems not that OM has already been applied, because the palette gives me the ability to mask rather than liberation (5 photos). Until I go to the drop down and then I find Release is an option after all.

    What is the difference here?   Not much of a problem, because either way I can release OM to be able to change the grad.

    The file is passed through several hands and play anywhere to try to resolve issues, and many stops and save slot, so something along the line was of course done a logo and not the other because of the difference, but I can't for the life of me see what that.

    Screen Shot 2015-08-06 at 12.44.21.pngScreen Shot 2015-08-06 at 12.44.36.png

    I hope someone can help. Very appreciated


    See you soon

    Dave

    Dave,

    I've (mis) understanding the issues, you can account for the box to the right in the main palette transparency (called thumbnail) here.

    Illustrator help | Transparency and blending modes

    represents the masking objects.

    Some of your screenshots show no object mask, so it only is not really a mask even if do the opacity mask has been clicked and there seems to be one in the layers palette, wherever you look.

    I think that it is perhaps the issue.

  • need help with the mac version of PES

    need help with the mac version of PES

    If you follow the 7 steps you can dl a trial via the links here: http://prodesigntools.com/tag/ddl

    and activate it with your serial number.

    If you have a problem dl'g, you don't follow all 7 steps.  the most common mistake is not meticulously follow the steps 1, 2, and/or 3 (which adds a cookie to your system, allowing you to download the correct version of the adobe.com site).

    p.s. If you need a more direct link, you must specify the exact version you want.

  • Making the ear of corn and need help with the ball.

    I do some corn on the COB for an illustration and I need help with the texture of the ball. I've been slowly making progress with gradient for kernels mesh, but I can't seem to recreate the look of the ball at all. I tried to recreate it in a rectangle by using the option in the menu object (1 row, 50 columns) gradient mesh and I'm trying with the fusion in object mode, but not lucky yet. Can someone help to put me on the right track to make the texture:

    http://images.clipartof.com/sweet-corn-on-the-cob-with-husk-royalty-free-vegetable-stock-photo-by-kennygadams-4501068853.jpg

    http://image.shutterstock.com/display_pic_with_logo/660550/660550,1298544740,8/stock-photo-ripe-corn-vector-illustration-on-white-background-71847955.jpg

    http://static5.depositphotos.com/1012047/533/v/950/depositphotos_5336961-Corn-oil.-Stylized-drop-of-oil-and-corn-cob..jpg

    I've been slowly making progress with gradient for kernels mesh, but I can't seem to recreate the look of the ball at all.

    Tank,

    You have published three images stylistically very different. The first is photographic and call probably (but not necessarily) for graduates of mesh. The other two are graphical treatments (and frankly, they're both rather flat; lack of depth).

    Illustration style extends the range of cartoonish in sketchy photo-realism and all the rest. The problem is you didn't show your own attempt so that anyone can have an idea of what you're trying to achieve the stylistic point of view.

    I just need to put in place so that the final step does not appear the whole box. The problem now is trying to make the style of the good brush to reproduce the effect...

    You seem to think you have to build a kind of linear construction and then find a way to reshape the shape of each part of the leaf. Yes, you pouvez approach it this way, but Illustrator users has often tend to be what aunt Molly would call "too clever by half."

    Not everything must be something semi intelligent auto or complex and tedious consruct involving brushes, envelopes, masks, etc, etc. Much can be accomplished by thinking that he just thanks to measure you draw directly economic paths and constructions, which take no more time (often less) and result in very tidy, simple files. Again, a lot depends on what you are trying to achieve the stylistic point of view. But here's an example that only took a few minutes to draw:

    If the above consists of:

    Three roads closed, 8 points each, with ordinary linear degrees

    Three mixtures of open path with three anchor points for each key path

    Six paths closed for shadows / highlights, with 19 points in total

    Mixtures being directly from the paths drawn comic forms, the spacing of the veins 'automatically' and intuitively follows the width from point of view of the worksheet.

    Rather than to build a boilerplate brush, colouring and the weight of each of the three main paths of the vein mixtures can be set individually at any time, simply directly by selecting the key path.

    JET

  • I need help with the control of two .swf in third.

    Hi, thanks for reading!

    I need help with the control of two .swf in third.

    I have a problem when I need to use a .swf in a digital signage solution, but were advised by the Legal Department, it cannot be changed in any way, I can not also have the source file blah blah blah. I pulled the .swfs on their site and I decompiled to see what I was up against.

    The main SWF that I need control is HCIC.swf and the problem is that it starts with a preloader, which, after the loading stops on a framework that requires user input to (button) on a play button, until the film will proceed and replay.

    What I've done so far is to create a SWF container, HCIC_container.swf, which will serve as a target for the HCIC.swf and I would like to send actionscript in the file, I am not allowed to edit.

    I managed to get done with help from someone on another forum. It is my hope that the following script just start HCIC.swf a framework after the preloader and button play and just play through.

    var container: MovieClip = createEmptyMovieClip ("container", getNextHighestDepth());
    var mcLoader:MovieClipLoader = new MovieClipLoader();
    mcLoader.addListener (this);
    mcLoader.loadClip ("MCIC.swf", container);

    function onLoadInit(mc:MovieClip) {}
    mc.gotoAndPlay (14);
    }

    But unfortunately it does not solve my problem. Because there is a media - controller.swf, which is charged by HCIC.swf who has orders, including the play button to start HCIC.swf.

    Here is a link to a .zip with all 3 files .swf file and all 3 .fla files.

    http://www.axiscc.com/temp/HCIC.zip

    What I have to do is to automatically start the HCIC.swf file, bypassing the pre-loader and play button without having to edit it or in the media - controller.swf in any case. Thus, all scripts must be done in HCIC_container.swf.

    I know it is confusing and it is difficult to explain, but if you look at the files it must make sense.

    ActionScripting is far from my point hard, so I'm definitely over my head here.

    Thanks for your help.

    Got my solution on another forum.

    http://www.ActionScript.org/forums/showthread.php3?t=146827

  • Need help with the alignment of the text

    I don't know the answer to this question is simple, especially since I have no chance of finding the same question asked previously.  I want middle align text so that it is centered between the top and bottom of the box / text field created using the "text" tool  Frame on the left is simple: I just click on the button "align left" on the text panel.  There is no button to the top, in the Middle, or align at bottom.  In fact, when I'm done with this question, I'll go ahead and present it as a new idea!

    I also need to do the same with the text I add the vertical menu widget (menu manual buttons)... If there is a big difference in the way in which this is done, please let me know.

    Here is an example of what I'm willing to do.  Yes - the bottom image is a composite, then please ignore the spaces at the beginning of the text.  I also wanted to "align middle" instead of "align center".

    Text_Alignment.jpg

    Thank you!

    If you want to center align text vertically, use top padding spacing Panel and change the desired number of pixel values (depending on the size of the text block).

    Also, you can use whole pixel values absolute for all major (i.e. 16 px) values rather than the values of percentage (120%) that are managed differently in different browsers.

    Here's a screenshot of the sample with settings that worked for me in my case where the text appears to be centered in all major browsers.

    You can also watch follows her thread that should answer most of your vertical alignment related research.

    http://forums.Adobe.com/thread/996101

    Thank you

    Vinayak

  • Need help with the verification of the student

    My daughter bought Adobe Acrobat Pro XI on new Amazon and then we followed the directions on Adobe to verify she is a student at the high school.  It's been 3 days and we still have not received the activation code to use our product?  Adobe support is horrible (I was on the phone for hours without that person never responding) and there is nowhere to present a plane ticket.

    Unfortunately it is in the forums that can do a lot for help you, since most of us are users of products like your daughter, and no employee here don't have much ability to deal with what anyone on your behalf beyond possibly check status.

    Phone support | Orders, returns, exchanges

    http://helpx.Adobe.com/x-productkb/global/phone-support-orders.html

    Chat support - the link below click the still need help? the option in the blue box below and choose the option to chat...

    Get help from cat with orders, refunds and exchanges (non - CC)
    http://helpx.Adobe.com/x-productkb/global/service-b.html ( http://adobe.ly/1d3k3a5 )

    Another good resource for information is the student and teacher edition information forum:

    http://forums.Adobe.com/community/download_install_setup/student_and_teacher_edition_infor mation_? view = discussions

  • Need help with the port forwarding for a XBox remote Streaming

    I have a router R6200v2 and need help with port forwarding.

    I came across this set of instructions for setting up stream port forwarding XBox remotely from anywhere

    http://kinkeadtech.com/2015/07/how-to-stream-Xbox-one-to-Windows-10-from-anywhere-with-Internet/

    I have no idea when it comes to such things and I want to make sure I do it correctly without messing up my existing home network.

    Port Forwarding and triggering Port pages setup look very different from what the guy uses. Can someone walk me through what I do to set up please?

    Hi @varxtis,

    You must enter them in the field for a start external Port and external completion Port. You will need to send individually except for the range of 49000-65000. The steps are as follows.

    1. create a Service name (it could be something else that you cannot use the same service name twice. Ex. XBOX1, XBOX2 and so forth.)

    2. Select the type of service (TCP, UDP or both)

    3 entry 5050 times a start external Port and external endpoints.

    4. Select the IP address of your XBOX.

    5. Select apply.

    6 do the same for other port numbers. To the beach, use 49000 for the external departure Port and for the external completion Port 65000.

    Kind regards

    Dexter

    The community team

Maybe you are looking for