CSS problem side

I have a little problem in css and I don't know how to fix...

Unknown.png

HTML

< section class = "content" >

header text < h1 > < / h1 >

< side >

text < p > < /p >

ALALA < p > < /p >

Lalala < p > < /p >

ALALA < p > < /p >

ALALA < p > < /p >

Lafon < p > < /p >

Laetitia < p > < /p >

Laetitia < p > < /p >

< / side >

< section >

text of paragraph < p > < /p >

< p > other text < /p > p

< / section >

< / item >


yellow background is cancelled inside the container and next to the section

side {}

float: left;

Width: 180px;

background: #EADCAE;

height: auto;

padding-top: 10px;

padding-right: 0;

padding-bottom: 10px;

padding-left: 0;

}


{section}

margin-top: 15px;

margin-bottom: 15px;

Width: auto;

Display: block;

}

. Container {}

Width: auto;

Max-width: 960px;

padding: 10px;

Top: 0px;

margin-right: auto;

left margin: auto;

top of the margin: 20px;

}


Obviously, I want the side next to the section be in the container.

I do not use width in pixels bacuse other pages have not cancelled and that's a liquid container

so... I Don t know where im wrong

the content must have an overflow hidden in order to work

Tags: Dreamweaver

Similar Questions

  • Help! CSS problem? My head is gone!

    Help, please

    -don't know what I did, but my head is gone--I think it's a CSS problem, but I'm not sure.  Can someone take a look please?

    http://louisianaqio.eqhs.org/index.html

    Thank you!!

    DebLouisiana wrote:

    I hate to ask, but can you tell me how get the header centered - centered above the wrapper before that I messed up.

    Change your 'headercontainer' css such as shown below:

    {#headercontainer}
    Width: 760px;
    margin: 15px 0 auto;
    }

  • Advanced CSS problem

    Hello!

    I "inherited" a Web site layout that has some CSS problems, I hope you can help me with. I've tried everything I can think of, but I still have the problem.

    Here's the layout: http://www.96ppi.net/ibooks/

    It is the homepage (front). Looks fine in IE, but the boxes on the right fails in Firefox. Only problem is.

    However, the biggest problem is that some content overlap, to make the text unreadable (ugly) as in this page:

    http://www.96ppi.NET/iBooks/Produkt.htm

    The problem I have is that the CSS is written by another guy, which I don't even know, and it is pretty advanced (convoluted is another word). And I can't seem to solve these problems with Firefox (and IE7), display of text on top of eachother.

    The HTML and CSS code removes reasonably in a validator...

    CSS files:

    http://www.96ppi.net/iBooks/narrowcontent.CSS (no doubt where the fault)
    http://www.96ppi.NET/iBooks/navigation.CSS
    http://www.96ppi.NET/iBooks/pageLayout.CSS
    http://www.96ppi.NET/iBooks/rightcolumn.CSS
    http://www.96ppi.NET/iBooks/typography.CSS

    ADVICE, you can provide would be appreciated. Let me know if I can provide further information.

    Mathias

    Hi Mathias,.

    According to my observation, that you need to add "display: table" this will also work in FF and IE7

    Name of the class:
    Class = RightBoxMiddle

    Add Style
    style = "display: table;"

    Enjoy! :)

  • CSS problem, please help...

    Hello

    I have an irritating problem where my H1 font rendered Times New Roman instead of Arial. Can anyone who is better at CSS, I understand why. You can see the page here... annoying css problem. The h1 code is as follows:

    #mainright h1 {}
    Police: Arial, Helvetica, without serif.
    font-size: 1.8em;
    color: #FFFFFF;
    Padding: 40px 15px 15px 0;
    Police-weight: normal;
    }


    the complete stylesheet is:

    / * CSS document * /.

    * {margin: 0; padding: 0}

    p {padding-bottom: 12px}

    {body
    margin: 0px;
    background-color: #E7E7E7;
    }
    {#MainContainer}
    margin: 0px auto;
    background-color: #660C1B;
    Width: 746px;
    }
    #Container {}
    margin: 0px auto;
    background - image: URL(images/white_bgcol.gif);
    Width: 728px;
    }
    {#SubContainer}
    margin: 0px auto;
    Width: 692px;
    padding-bottom: 14px;
    }
    #Header {}
    Width: 692px;
    margin-bottom: 16px;
    }
    #Logo {}
    float: left;
    }
    {#TopNavigation}
    do-family: Verdana, Arial, Helvetica, without serif.
    do-size: 12px;
    color: #413B3B;
    text-decoration: none;
    text-align: left;
    margin-bottom: 16px;
    }
    #TopNavigation ul li {}
    Display: inline;
    list-style: none;
    margin: 0px;
    12px to padding: 0px 0px 0px;
    }
    #TopNavigation a {}
    do-family: Verdana, Arial, Helvetica, without serif.
    do-size: 12px;
    color: #413B3B;
    text-decoration: none;
    text-align: left;
    }
    #TopNavigation a: hover {}
    do-family: Verdana, Arial, Helvetica, without serif.
    do-size: 12px;
    color: #547e58;
    text-decoration: none;
    text-align: left;
    border-bottom: 3px solid #115E58;
    }
    . {PicSpace}
    margin-right: 2px;
    float: left;
    }
    {#BodyContainer}
    Width: 692px;
    }
    {#RightBanners}
    Width: 334px;
    margin-left: 9px;
    float: right;
    }
    #RightBanners. IMG {}
    margin-bottom: 3px;
    }

    {#TextBox}
    background - image: URL(images/textbox_bg.jpg);
    background-repeat: repeat no.;
    Width: 349px;
    float: left;
    do-family: Verdana, Arial, without serif.
    do-size: 11px;
    Color: #333333;
    text-decoration: none;
    text-align: left;
    }
    . {TextMargin}
    Padding: 40px 0px, 16px 16px;
    }
    #TextBox a {}
    do-family: Verdana, Arial, without serif.
    do-size: 11px;
    Color: #333333;
    text-decoration: none;
    text-align: left;
    }
    #TextBox a: hover {}
    do-family: Verdana, Arial, without serif.
    do-size: 11px;
    Color: #333333;
    text-decoration: underline;
    text-align: left;
    }
    #TextBox. Title {}
    do-family: Arial, Helvetica, without serif.
    do-size: 22px;
    make-weight: bold;
    color: #ffffff;
    text-align: left;
    }
    #TextBox. Subheading {}
    do-family: Arial, Helvetica, without serif.
    do-size: 16px;
    make-weight: bold;
    color: #ffffff;
    text-align: left;
    }

    #TextBox ul
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
    }

    Li #TextBox
    {
    display: block;
    padding: 3px 3px 3px 0;
    margin-left: 15px;
    text-decoration: none;
    make-weight: normal;
    list-style-type: disc;
    }

    #Footer {}
    margin: 10px 0px auto;
    Width: 728px;
    do-family: Arial, Helvetica, without serif.
    do-size: 9px;
    color: #ffffff;
    text-align: left;
    }
    #Footer. Copyright {}
    float: left;
    margin:-4px 3px 18px 0px;
    do-family: Verdana, Arial, Helvetica, without serif.
    font-size: 21px;
    make-weight: bold;
    color: #ffffff;
    text-align: left;
    }


    #Footer a {}
    do-family: Arial, Helvetica, without serif.
    do-size: 9px;
    color: #ffffff;
    text-align: left;
    text-decoration: none;
    }
    #Footer a: hover {}
    do-family: Arial, Helvetica, without serif.
    do-size: 9px;
    color: #ffffff;
    text-align: left;
    text-decoration: underline;
    }
    {#RightBox1}
    background-color: #413B3B;
    Width: 334px;
    height: 180px;
    margin-bottom: 10px;
    }
    #RightBox1 a {}
    do-family: Arial, Helvetica, without serif.
    do-size: 11px;
    make-weight: bold;
    color: #72C9EA;
    text-decoration: none;
    }
    #RightBox1 a: hover {}
    do-family: Arial, Helvetica, without serif.
    do-size: 11px;
    make-weight: bold;
    color: #72C9EA;
    text-decoration: underline;
    }
    . {RightBoxText}
    padding: 10px;
    do-family: Arial, Helvetica, without serif.
    do-size: 11px;
    make-weight: bold;
    color: #ffffff;
    text-align: left;
    text-decoration: none;
    }
    . {HeadingPink}
    do-family: Arial, Helvetica, without serif.
    font-size: 20px;
    make-weight: bold;
    color: #F000C0;
    text-align: left;
    text-decoration: none;
    }
    . {HeadingWhite}
    do-family: Arial, Helvetica, without serif.
    font-size: 21px;
    make-weight: bold;
    color: #ffffff;
    text-align: left;
    text-decoration: none;
    }
    . {HeadingBlack}
    do-family: Arial, Helvetica, without serif.
    font-size: 24 PX.
    make-weight: bold;
    Color: #000000;
    text-align: left;
    text-decoration: none;
    }
    . {HeadingBlue}
    do-family: Arial, Helvetica, without serif.
    font-size: 20px;
    make-weight: bold;
    color: #72C9EA;
    text-align: left;
    text-decoration: none;
    }
    {#RightBox2}
    background-color: #115E58;
    Width: 334px;
    height: 160px;
    margin-bottom: 10px;
    }

    #RightBox2 a: link {}
    color: #FFCC66;
    text-decoration: none;
    }

    #RightBox2 a: hover {}
    color: #fff;
    text-decoration: none;
    }

    #RightBox2 a: visited {}
    Color: #FF0000;
    text-decoration: none;
    }

    #RightBox2. Bult {}
    background - image: URL(images/rbox2_bult.gif);
    background-repeat: repeat no.;
    padding-left: 25px;
    padding-bottom: 1px;
    }
    {#RightBox3}
    background-color: #413B3B;
    padding: 10px;
    }
    {#RightBox3Text}
    background-color: #FFFFFF;
    padding: 10px;
    do-family: Arial, Helvetica, without serif.
    do-size: 11px;
    make-weight: bold;
    Color: #000000;
    text-align: left;
    text-decoration: none;
    }
    . {Box3Image}
    float: right;
    margin: 0px 10px 40px of 40px;
    }
    {#LpRightBox}
    background-color: #413B3B;
    padding: 10px;
    Width: 429px;
    margin-left: 6px;
    float: right;
    }
    {#LpRightBoxText}
    background-color: #FFFFFF;
    padding: 10px;
    do-family: Arial, Helvetica, without serif.
    do-size: 12px;
    Color: #000000;
    text-align: left;
    text-decoration: none;
    }
    {#LpRBoxHeading}
    background - image: URL(images/lptitle_arrow.gif);
    background-repeat: repeat no.;
    do-family: Arial, Helvetica, without serif.
    font-size: 25px;
    color: #ffffff;
    text-align: left;
    text-decoration: none;
    height: 30px;
    padding: 0px 5px 0px 50px;
    }



    {#LpLeftBox}
    background - image: URL(images/lp_lbox_bg.jpg);
    background-repeat: repeat no.;
    Width: 237px;
    float: left;
    }
    {#LpLeftText}
    padding: 10px;
    do-family: Verdana, Arial, without serif.
    do-size: 11px;
    Color: #333333;
    text-decoration: none;
    text-align: left;
    }
    . {LpLHeading}
    do-family: Arial, Helvetica, without serif.
    font-size: 25px;
    color: #ffffff;
    text-decoration: none;
    text-align: left;
    }
    . {LpLSHeading}
    do-family: Arial, Helvetica, without serif.
    do-size: 12px;
    make-weight: bold;
    color: #68111E;
    text-decoration: none;
    text-align: left;
    }
    . {ButtonsDiv}
    Width: 174px;
    float: left;
    margin: 2px 0 0 0;

    }
    . {BlackButtons}
    do-family: Verdana, Arial, Helvetica, without serif.
    do-size: 10px;
    make-weight: bold;
    color: #ffffff;
    text-decoration: none;
    text-align: left;
    Display: block;
    Width: 154px;
    height: 25px;
    Padding: 12px 10px 0px 10px;
    background-color: #413B3B;
    }
    . {BlackButtons:hover}
    do-family: Verdana, Arial, Helvetica, without serif.
    do-size: 10px;
    make-weight: bold;
    color: #ffffff;
    text-decoration: none;
    text-align: left;
    Display: block;
    Width: 154px;
    height: 25px;
    Padding: 12px 10px 0px 10px;
    background-color: #6F6F6F;
    }

    #LpRightBoxText ul
    {
    margin: 0 10px 0 0;
    padding: 0;
    list-style-type: none;
    }

    Li #LpRightBoxText
    {
    display: block;
    padding: 3px 3px 3px 0;
    margin-left: 15px;
    text-decoration: none;
    make-weight: normal;
    list-style-type: disc;
    }

    a: link {img
    border: none;
    }

    {#mainleft}
    float: left;
    Width: 342px;
    height: 209px
    }
    {#mainright}
    float: left;
    Width: 350px;
    height: 209px;
    Background: URL(images/lp_pic02.jpg) no-repeat;
    }


    #mainright h1 {}
    Police: Arial, Helvetica, without serif.
    font-size: 1.8em;
    color: #FFFFFF;
    Padding: 40px 15px 15px 0;
    Police-weight: normal;
    }

    . Author {}
    fonts: Verdana, Arial, Helvetica, without serif.
    do-size: .8em;
    color: white;
    margin: 0;
    padding-left: 15px ;}




    Any help appreciated.

    Julie
  • CSS problem on some websites

    Some sites Web CSS will not be charged. Some examples are:

    https://addons.Mozilla.org/en-us/Firefox/
    https://github.com/

    They get on Google Chrome loads correctly is not a network problem. I already tried to start firefox in safe mode, still does not work.

    You can check the date and time of the clock on your computer: (double) click on the clock icon in the Windows taskbar.

  • CSS problem - empty space at the top of page

    Hi guys, I wonder if maybe someone can see what I did wrong please...  I use Dreamwweaver CC and worked on a few test pages to create a new site, and in some way, I changed without knowing something in the css which means there are now a few inches of white space at the top of the site, above my logo - while the original model fits comfortably up to near the top of the page.    (Problem page - http://www.baseballhypnosis.com/running/mental-training-articles/index.php / Original model - http://www.baseballhypnosis.com/new/running/index.php ).    Any thoughts would be greatly appreciated!  Thank you, Craig T



    In custom.css, line 439, remove body {padding-top: 135px}

  • Simple CSS problem... I hope.

    Hello world

    I am very nw web design and I have a very basic problem, which is:

    CSS background on the body. (using DW CS3)

    All I would do is have an image in the top, left, and repeat-x, I can get it, is the easy part, the problem I have is that nothing else shows when I Preview in the browser, NOTHING else, without tables, text, iamge, just repeat body background image?

    any help would save my mind of the explosion, thank you.

    What do you mean nothing else shows?

    I just copied the html and css code and I see the table and the text very well. However, I'm on CS4.

    I notice you have a lot of empty table cells. Try to insert nonbreaking spaces - & nbsp;  (remove the space after the &) in empty cells. I don't know if CS3 has had a problem with the empty table cells.

  • CSS problem?

    Hi all

    First of all, thank you for help. I'm having a problem with what appears to be "CSS". I am teaching Dreamweaver, and this problem makes me mental. I hope it's something very simple to fix. I have included 2 screenshot to help you better understand as well.

    I'm changing the font SIZE in another model that I did, and when I change from '12' to '14' (Arial font) he changes ANY font on the page size, put all my 'slices' completely out of wack. I want to be able to change the font size in a different area of the page (s) without him doing that. Please can someone explain how I can do this in detail? It makes me kind of mind at this point.

    Much appreciated in advance (attached screenshot)

    Matt Rimmer

    This screenshot is with TWO fonts of the same size. No problem here. The second screenshot is where shit hits the fan for me!

    css1.jpg

    css2.jpg

    to come even if I point out that the code and I aren't even friends - of course, we danced a few times, but we are still far from making a commitment to another!

    If you are serious about wanting to use DW, then this will have to change.  Not only you will find yourself wandering one mysterious anomaly to another, but also you will not understand the answers you get here in this forum.  It is the code.  You can simply use DW in a real sense without a good understanding of HTML and CSS - lights should start here:

    http://www.w3schools.com

    My first comment on your code, it's that you do not have a valid and complete doctype.  Each page should have one, otherwise it will be visited by browsers quirks mode - this isn't a good thing.  You must choose a doctype that is consistent with your understanding of HTML and in your case, it would be HTML 4.01 Transitional.  By including this doctype on your page, you're avoids not only quirks made, you also tell the validator that the page contains the markup of type 'Loose' HTML 4.01 in his use of the tag attributes. You will understand it later.

    My next comment about your code, is that your approach to the layout is seriously flawed.  I'm suspicious that this code HTML was written by Photoshop or fireworks, perhaps because one) there is a layout based on a table, and b) there are pass - and rowspans galore in the table.  These last two are the kiss of death for a page layout, because they are your table, unable to resist the small 'form' changes that occur when people increase/decrease the size of text in their browser, and inexplicably gaps will appear in your table accordingly.  Please read this article to learn more on this topic and why this is happening - http://www.apptools.com/rants/spans.php.

    The answer to your original question is this - all readable content (very little) on the page is a table (i.e. in a cell))).  You have this rule in your style sheet-

    tr td {make-size: 12px ;}}

    who says "search for all cells of a table on the page and make their content 12px font size." In other words, it affects the content of the page.

    Assuming that you don't want to do would be to change this content to 12 px size and leave the rest of the content to 11px.

    What's in your attic?

    You can do this any number of ways.

    1. you can add some inline CSS-

    What's in your attic?

    that would affect only the contents of the cell.

    2. you can add tags to content and adjust your rule-

    What's in your attic?

    with

    tr td p {make-size: 12px ;}}

    3. you can add a CSS class or ID for the desired cell and adjust your rule-

    What's in your attic?

    #special {do-size: 12px ;}}

    Is it makes sense?  You see why we say you have to have some comfort with HTML and CSS?

    In regard to your second question about just flatten the image, the last thing you want to do is to create a web page that can not be spidered.  A page that contains only images is one of these. Not only is such a heavy download page because it is filled with images, but it also, contains no meaningful content for the search engines rank your page with.  You might as well just after a link to a PDF file...

  • Flash header not displaying not correct size... CSS problem?

    I wanted to use Dreamweaver to build a simple one page site.  The problem I have is that my header 715 x 150 shows extremely small.  It seems that it is a percentage of the 715 x 150.  I can enlarge it, but then the box so that it grows as well and uses the page.  Here is the site: http://3due.com/index14.html .  If you cannot view the source, then let me know and I'll post the code.

    I'm sure it's something simple, but I've tried everything I know to try to locate the problem.  I'm not familiar with CSS.

    Thanks in advance,

    MK

    Two things.  First of all this javascript file is also absent on the loading of the page: Scripts/expressInstall.swf

    Second, I downloaded this file of your site and the size that it is being 1200 x 500, not 715 x 150.  Why don't simply re-save the document in Flash.  By changing the size later I think which is causing your problem of distortion.

  • Rollover to IE6 CSS problem

    I'm filling a site for my dentist and having some difficulties to tame IE6 into submission.  Specifically, I have a problem with the bearings in the navigation menu.  When a page is selected, the selected button should turn yellow. However, instead of display the button, IE6 shows the contact button (and then more buttons in the navigation bar, according to the chosen button width).  There is no Javascript code used for bearings.  This is the CSS right.  The bearings of menu works perfectly in all browsers EXCEPT IE6.  It seems that IE6 has problems with the element of 'focus'...?  You can see the problem here (don't forget to display the URL in IE6 - only IE6 is having this problem).

    I have hover and focus defined within the main stylesheet, which you can see here.  The menu bar has 3 levels, and you can see the image PNG here. In the HTML page, you will find:

    <div id="nav">
    <ul id="menu">
         <li><a href="index.html" class="home focus">Home</a></li>

    Update is applied to the class of the selected page (visited).

    What causes IE6 to have problems with bearings of menu?  How to solve this?  I have a separate stylesheet for IE6, so I can easily add more hacks to it.

    It is not too difficult.  Once you cut through the images that you will find with the same basic CSS with image configuration in slices for the basic one: link, a: active, States.  Then, for one: steady state just change the image using the background-image property.  The basic format is:

    background-image: url(pathto/image.png);

    I use it with my menus all the time.  However, I find most of the time that I do my menus using a plugin project seven ( http://www.projectseven.com/ ).  My site menus are usually made with Pop Menu Magic (all their products are great and support is there for although it their forum is a discussion forum).

    Only my secondary site which I am finish uses images to extend loans, and it only works in IE 7 and above all because of the transparency of the png.  www.exitplaystation.com

  • Code view - CSS problems

    Suddenly the CSS files are displaying in Chinese and crashing DW8 on an iMAC intel. I have reset the display font in the preferences. Still no go. Does anyone else have this problem? Ordinary text editor indicates the file is OK and not corrupt.

    Thank you

    Phil

    Thank you, a re - install solved the problem
    -Phil

  • Footer CSS problem

    I'm new in the design, using css for page layout, and I'm having a problem getting the contents of the page to push the foot down.
    Here is the page: http://wmsgroup.com/client_temp/osps/vsc.html
    I have attached the style sheet.

    Thank you!

    OlDirty wrote:
    > I'm new in the design, using css for page layout, and I'm having a problem to get
    > the content of the page to push the foot down.
    > Here is the page: http://wmsgroup.com/client_temp/osps/vsc.html
    > I have attached the style sheet.
    >
    > Thank you!

    I had a small look - delete the height of your rule of #content_.

    HTH

    --
    Chin chin
    Sinclair

  • sample FlexStore application... CSS problem

    I guess that's the problem.
    In the 'ReadMe.html' file for the flexstore sample approx. She States,
    "Click beige.css and blue.css files in the browser and click on"Compile CSS to format SWF." To support the loading of runtime, but this isn't an option when I right click on the file in the Navigator view.

    Rather than hardcode this info. I would like to know the reason for the malfunction.

    Any advice?

    There were minor changes to the Flexstore with 2.0.1 which is a free update that is released a few days ago. Looks like you are running 2.0 with 2.0.1 example code. You must obtain the free update or use the Flexstore 2.0 code.

  • Basic CSS problem

    I used CSS for a while, but now I have a unique problem.

    I have linked the two style sheets to my html document and CSS is displayed correctly in Dreamweaver. When I preview the page FF or IE6, any style applied.

    I've used DW to the page a link to the style sheets for the path is correct (set to the parent site and not parent document). And while I'm typing this it occurs to me that the answer may be this:

    The second style sheet is empty because I haven't decided on the statements that it again that I'm in the early stages of development. Knowing that styles cascading with the last listed sheet takes on before the leaves, this could explain why the style is not visible? If the stylesheet is empty, does that invalidate style listed in the previous leaves?

    Sorry for the weird question but I make an effort to do CSS correctly after reading 'Beginning CSS Web Development' by Simon Collison.

    Thank you

    Thanks Murray! It's always the simple things that me strain.

  • Dreamweaver Cs3 CSS problems

    Hello, I have problems with my new version of CS3. When I am working in split view, or design view also, any css that I add to the page does not appear during the design of the page. Be it online or attached, I don't see the changes made to the page while working on it. Is there something I need to set in my properties to make it work? I did not have this problem in Dreamweaver MX 2004. Any help would be so useful. Thank you in advance.

    SoC

    Is view > Style made > checked display Styles?

    --
    Concerning

    John Waller

Maybe you are looking for