Left side vertical border on the page

Discussion in 'HTML' started by colleen1980@gmail.com, May 31, 2008.

  1. Guest

    Hi: Is this possible that i can create a vertical thick line on the
    left side as a left vertical border on the page?

    Thanks.

    <html>
    <head>
    <style type="text/css">
    a {
    color: 'yellow';
    font-size: smaller;
    }
    a:hover {
    color: #CC0033;
    font-size: larger;
    }
    </style>
    </head>
    <body>

    <!--img style="float:right;" src="smeg.jpg" />
    <div style="width:100%;color:#FFFFFF;background:black;padding-top:
    3px;font-family:Georgia,Times;font-size:54px;font-weight:bold;line-
    height:1em;padding-

    bottom:5px;">
    <span title="Link to Home" onmouseover="this.style.color='#F60';"
    onmouseout="this.style.color='#FFFFFF';">NORTH EAST SERVICES</span>
    </div>
    <div style="background:black;font-family:geneva,arial;color:#F60;font-
    size:12px;font-weight:bold;padding-left:5px;">3235 PARK SIDE PLACE</
    div>
    <div style="background:black;font-family:geneva,arial;color:#F60;font-
    size:12px;font-weight:bold;padding-left:5px;">PHONE (631) 222-2270
    FAX (631) 335-

    2247</div>
    <div style="background:black;font-family:geneva,arial;color:#F60;font-
    size:12px;font-weight:bold;padding-left:5px;">Office Hours: Monday to
    Friday (8:00 AM

    to 5:00 PM)</div>
    <div style="width:100%;background:#F60;text-align:center;font-
    size:small;padding-top:8px;font-family:system,geneva;font-
    weight:bold;">
    <a href="mk.html">PEDIATRIC NEUROLOGY</a> &nbsp&nbsp&nbsp <a
    href="mdjk.html">ADULT NEUROLOGY</a> &nbsp&nbsp&nbsp <a
    href="direcs.html">DIRECTIONS TO OUR

    OFFICE</a> &nbsp&nbsp&nbsp <a href="tstprf.html">TEST PERFORMED IN OUR
    OFFICE</a>
    </div>
    <div style="width:100%; text-align:center">
    <span style="margin-right:6px;margin-top:
    5px;color:white;background:green;border:1px solid darkkhaki;font-size:
    30px;line-height:60px;padding-

    top:2px;padding-right:5px;font-family:times;">SPECIALIZING IN
    PEDIATRIC AND ADULT NEUROLOGY</span><div style="clear:both;"><br></
    div>
    </div>
    <BR><BR>
     
    , May 31, 2008
    #1
    1. Advertising

  2. Gazing into my crystal ball I observed ""
    <> writing in news:cdbfa225-4563-4265-aa48-
    :

    > Hi: Is this possible that i can create a vertical thick line on the
    > left side as a left vertical border on the page?


    A URL would have been better but...

    >
    > Thanks.
    >
    ><html>
    ><head>
    ><style type="text/css">
    > a {
    > color: 'yellow';
    > font-size: smaller;
    > }
    > a:hover {
    > color: #CC0033;
    > font-size: larger;
    > }
    ></style>


    This is going to cause jumping of surrounding text, not recommended.

    ></head>
    ><body>
    >
    ><!--img style="float:right;" src="smeg.jpg" />
    ><div style="width:100%;color:#FFFFFF;background:black;padding-top:
    > 3px;font-family:Georgia,Times;font-size:54px;font-weight:bold;line-
    > height:1em;padding-
    >
    > bottom:5px;">


    Put that into a style definition. Stop using pixels for font size.
    Read archives of this group for reasons.

    ><span title="Link to Home" onmouseover="this.style.color='#F60';"
    > onmouseout="this.style.color='#FFFFFF';">NORTH EAST SERVICES</span>
    ></div>


    No need for javascript. This also conflicts with the style definitions
    you have above.

    ><div style="background:black;font-family:geneva,arial;color:#F60;font-
    > size:12px;font-weight:bold;padding-left:5px;">3235 PARK SIDE PLACE</
    > div>


    What's up with all these divs? This whole thing looks like a paragraph,
    use the right tool for the job, p element and br element for line
    breaks.

    snip more divititis

    ><BR><BR>
    >


    And mixing HTML with XHTML. Please stick with one, HTML is better, read
    the group for reasons why.

    To answer your original question:
    div#sidebar {border-left:solid thick #000}

    --
    Adrienne Boswell at Home
    Arbpen Web Site Design Services
    http://www.cavalcade-of-coding.info
    Please respond to the group so others can share
     
    Adrienne Boswell, Jun 1, 2008
    #2
    1. Advertising

  3. richard Guest

    On Sat, 31 May 2008 15:45:32 -0700 (PDT), ""
    <> wrote:

    >Hi: Is this possible that i can create a vertical thick line on the
    >left side as a left vertical border on the page?
    >
    >Thanks.
    >


    Search for "border attributes".

    e.g.:
    #sample { border-left:solid 10px black;}
    "black" could also be numeric as well.
     
    richard, Jun 1, 2008
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Kay
    Replies:
    2
    Views:
    7,212
  2. tshad
    Replies:
    0
    Views:
    2,291
    tshad
    Jan 31, 2005
  3. =?iso-8859-1?q?Jean-Fran=E7ois_Michaud?=

    Help on table align on left of page vs left hanging indent

    =?iso-8859-1?q?Jean-Fran=E7ois_Michaud?=, Jul 10, 2007, in forum: XML
    Replies:
    2
    Views:
    1,029
    =?iso-8859-1?q?Jean-Fran=E7ois_Michaud?=
    Jul 16, 2007
  4. Replies:
    0
    Views:
    96
  5. venu madhav

    Vertical scroll bar moving a bit left in IE

    venu madhav, Jun 25, 2010, in forum: Javascript
    Replies:
    7
    Views:
    162
    Evertjan.
    Jun 27, 2010
Loading...

Share This Page