Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Why won’t word wrap work with this css and html code?

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #42046
    ItsAllGood13
    Member

    Hi all,

    I’m having trouble trying to figure out why my text will not word wrap with an inserted picture.

    Text if formated correctly but as soon as the image is displayed the paragraph after the image will start on the line ‘under’ the image insted of floating to the ‘left’ or ‘right’ depending on where i want it displayed.

    Can anyone see anything that i am missing?

    Here is the code for the css:



    h1.content_info
    {
    float:left;
    clear:both;
    color:#AE8EA4;
    text-align:center;
    }
    p.content_info
    {
    font-family:”Myriad Pro”, “Trebuchet MS”, sans-serif;
    float:left;
    clear:both;
    color:#FFFFFF;
    letter-spacing:1px;
    font-size:15px;
    }
    p.content_info_italic
    {
    font-family:”Myriad Pro”, “Trebuchet MS”, sans-serif;
    float:left;
    clear:both;
    color:#BBBACB;
    letter-spacing:1px;
    font-style: italic;
    font-size:20px;
    }
    p.content_info_colour
    {
    font-family:”Myriad Pro”, “Trebuchet MS”, sans-serif;
    float:left;
    clear:both;
    color:#B097AE;
    letter-spacing:1px;
    font-size:15px;
    }
    img.alignleft { float:left; clear:both; margin:5px;}
    img.alignright { float:right; clear:both; margin:5px;}



    Here is the code taken from the .html:


    Who we are?

    text goes here text goes heretext goes here text goes heretext goes here text goes heretext goes here text goes heretext goes here text goes here.

    text goes here text goes heretext goes here text goes heretext goes here text goes heretext goes here text goes heretext goes here text goes here.

    text goes here text goes heretext goes here text goes heretext goes here text goes heretext goes here text goes heretext goes here text goes here!



    Thanks in advance!

    #121246
    Paulie_D
    Member

    I have to ask, why are you floating your paragraphs & headings? There doesn’t seem to be any need to do that.

    http://codepen.io/Paulie-D/pen/wzvKd

    #121257
    wolfcry911
    Participant

    I agree with Paulie. Further, the reason the p starts below the image is the clear: both

    #121331
    ItsAllGood13
    Member

    Thanks for the solution Paulie_D!

    The reason i was floating the paragraphs and headings was to ensure justification of text.
    there is another menu that is displayed above that which was causing me problems while i was writing/designing.

    In order to get around that at the time i had floated left but now realised there was no need.
    I have since removed the ‘float’ & ‘clear’ and now have it sorted.

    Your assistance was greatly appreciated….thanks again!

    I just have a couple more things to finish and then i can make the site live.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.