/    Sign up×
Community /Pin to ProfileBookmark

Removal of
within

    I have the layout of the following code how I wish it to display.
    The problem is that it does not validate because of the <br> tags within the <ul> element.
    It appears that only <li> tags can be used within the <ul> tags.
    Is there a CSS solution I can use instead of the <br>?

    [code]
    <!DOCTYPE html>
    <html lang=”en”>
    <head>
    <meta charset=”UTF-8″ />
    <title> HTML5 page </title>

    <!– link rel=”stylesheet” href=”common.css” media=”screen” –>
    <style type=”text/css”>
    ul { padding-left:10px; }
    li { padding-bottom:1px; }
    .liDate { display:inline-block; width:8em; list-style-type:none; font-weight:bold; }
    .liTime { display:inline-block; width:3em; list-style-type:none; }
    .liHead { display:inline-block; width:9em; list-style-type:none; font-weight:bold; }
    .liBody { display:inline-block; width:9em; list-style-type:none; }
    .liHeadDays { display:inline-block; width:9em; text-decoration:underline;
    list-style-type:none; font-weight:bold; }
    .wkSep { color:lime; }

    fieldset { width: 950px; }
    </style>

    </head>
    <body>
    <ul id=”liHead”>
    <li class=”liDate”><button id=”Wk2Sem”>Week to<br>Semester</button></li>
    <li class=”liTime”>Time</li>
    <li id=”Mon1″ class=”liHeadDays”>Monday</li>
    <li id=”Tue2″ class=”liHeadDays”>Tuesday</li>
    <li id=”Wed3″ class=”liHeadDays”>Wednesday</li>
    <li id=”Thu4″ class=”liHeadDays”>Thursday</li>
    <li id=”Fri5″ class=”liHeadDays”>Friday</li>
    <li id=”Sat6″ class=”liHeadDays”>Saturday</li>
    </ul>

    <p style=”font-weight:bold; color:green;”>Typical Week</p>
    <ul id=”tbody0″>
    <li class=”liDate”><button id=”TypWkClr”>Clear</button></li>
    <li class=”liTime”>AM</li>
    <li class=”liHead”> <input id=”tw0″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw1″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw2″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw3″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw4″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw5″ type=”text” value=””> </li>
    <br>
    <li class=”liDate”>&nbsp;</li>
    <li class=”liTime”>PM</li>
    <li class=”liHead”> <input id=”tw6″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw7″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw8″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw9″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw10″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw11″ type=”text” value=””> </li>
    <br>
    <li class=”liDate”>&nbsp;</li>
    <li class=”liTime”>Eve</li>
    <li class=”liHead”> <input id=”tw12″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw13″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw14″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw15″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw16″ type=”text” value=””> </li>
    <li class=”liHead”> <input id=”tw17″ type=”text” value=””> </li>
    </ul>
    </fieldset>

    </body>
    </html>
    [/code]

    to post a comment
    JavaScript

    3 Comments(s)

    Copy linkTweet thisAlerts:
    @SempervivumDec 03.2018 — "Tables are evil" - This doesn't apply to any structure. Looking at your page the structure is a table:

    There is a headline and a body

    There are rows

    There are columns

    Why not use a table for your layout?
    Copy linkTweet thisAlerts:
    @NogDogDec 03.2018 — As mentioned above, if it's tabular, use a table. If it's a list of lists, you could have child ul elements. I think* it's something like:
    ``<i>
    </i>&lt;ul&gt;
    &lt;li&gt;&lt;ul&gt;
    &lt;li&gt;...&lt;/li&gt;
    &lt;li&gt;...&lt;/li&gt;
    &lt;/ul&gt;&lt;/li&gt;
    &lt;li&gt;&lt;ul&gt;
    &lt;li&gt;...&lt;/li&gt;
    &lt;li&gt;...&lt;/li&gt;
    &lt;/ul&gt;&lt;/li&gt;
    &lt;/ul&gt;<i>
    </i>
    ``

    _________

    * It's been awhile since I've done that ?
    Copy linkTweet thisAlerts:
    @JMRKERauthorDec 04.2018 — I'll give each of those a try.

    Thanks.
    ×

    Success!

    Help @JMRKER spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 4.29,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,

    tipper: @Samric24,
    tipped: article
    amount: 1000 SATS,
    )...