SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Evangelist runeveryday's Avatar
    Join Date
    Jul 2009
    Posts
    437
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    how to layout the wbepage according to the image?

    2012-10-31_085619.png

    how to layout the webpage according to the image?

    the following is my html. but i feel the layout is not good? is there a better way to get that?

    Code:
        <div class="test">
            <p>p<br />r<br />o<br />g<br /></p>
            <img  src="#" />
            <div class="link">
                <a href="#">one</a><a href="#">two</a><a href="#">test</a><br />
                <a href="#">three</a><a href="#">fourtest</a><br />
                <a href="#">example</a><a href="#"></a><a>more </a>
            </div>
        </div>
    ps:the layout which locates on the right of the image is bad.if the test div are many.when under IE7 ,there are some misplacement in it. is there another way to layout it?

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Yeah, I don't think I'd use <br> elements there ... but you haven't posted any layout information as yet (i.e. CSS).

  3. #3
    SitePoint Evangelist runeveryday's Avatar
    Join Date
    Jul 2009
    Posts
    437
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    Yeah, I don't think I'd use <br> elements there ... but you haven't posted any layout information as yet (i.e. CSS).
    if you could not use br, which element will you be use?

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by runeveryday View Post
    if you could not use br, which element will you be use?
    It depends ... I wonder if it's worth doing as text at all, because it doesn't mean much. I would use an image with meaningful alt text, or perhaps CSS3 to make the text vertical ... although that won't work in all browsers.

    Or perhaps you could wrap the word in a column div, and each letter in a div set to width: 100% ... but I don't see the point, personally.

  5. #5
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    For that amount of effort you could wrap each letter in a span, display:block; and width:1em (or whatever) to the paragraph.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •