The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

change the forumsection

View previous topic View next topic Go down

Solved change the forumsection

Post by IdaTR on January 4th 2018, 11:25 am

Hey!

So im about to redesign my website, and i have a question.

Is it possible to make the category and all that appear this way:



HTML (This was made in brackets so the forumotions codes aren't included.)
Code:
<table class="cat">
            <th colspan="4">
                <h1>Start information</h1>
            </th>
            <tr>
                <td id="info"><a href="">Regler :</a></td>
                <td id="desc">
                    <p>Læs dette forum igennem, før du opretter dig som bruger.</p>
                    <p>Her finder du vigtige regler for siden samt overordnede informationer omkring universet. Kontakt en admin, hvis du har nogle spørgsmål.</p>
                </td>
                <td id="stats">
                    <p>Svar:</p>
                    <p>Emner:</p>
                </td>
                <td id="last">
                    <p>Sidste indlæg af:</p>
            </tr><tr class="under"><td><h2>Under Foras:</h2></td><td><a href=""></a></td></tr>
            <tr><td id="border" colspan="4"></td></tr>
            <tr><td id="info"><a href="">In Game Hjørne :</a></td><td id="desc"><p>Her kan du skrive lidt af hvert. Du kan blandt andet søge om emner og plots, meddele andre brugere om fravær, du kan melde din karakter til missioner så du kan få forskellige belønninger. Husk at sæt dine emner ind i de rigtige underfora.</p></td><td id="stats"><p></p><p></p></td><td id="last"><p></p></td></tr>
            <tr class="under"><td><h2>Under Foras:</h2></td><td><a href=""></a></td></tr>
            <tr><td id="border" colspan="4"></td></tr>
            <tr><td id="info"><a href="">Spørgsmål og Idéer :</a></td><td id="desc"><p>Hvis du har spørgsmål, eller mulige idéer til hvordan siden skal være, eller eventuelle plots, er du velkommen til at videregive dem til os her. </p></td><td id="stats"><p></p><p></p></td><td id="last"><p></p></td></tr>
            <tr class="under"><td><h2>Under Foras:</h2></td><td><a href=""></a></td></tr>
            <tr><td id="border" colspan="4"></td></tr>
            <tr><td id="info"><a href="">Character Sheet & Face Claim :</a></td><td id="desc"><p>Benyt dette fora til at beskrive din karakter, og indsende Face Claim.</p><p id="desc">Man bedes venligst udfylde dette skema så snart man starter inden du begynder at tråde.</p></td><td id="stats"><p></p><p></p></td><td id="last"><p></p></td></tr>
            <tr class="under"><td><h2>Under Foras:</h2></td><td><a href=""></a></td></tr>
        </table>

CSS

Code:
/** Category Table **/

.wrapper .Over table.cat {
    width: 77.5%;
    margin: auto;
    margin-top: 150px;
    float: right;
    margin-right: 20px;
}
.wrapper .Over table.cat:after {
    clear: both;
}

.wrapper .Over table.cat th {
    padding-bottom: 10px;
}

.wrapper .Over table.cat th h1 {
    font-family: Rajdhani;
    color: #fff;
    font-weight: 100;
    letter-spacing: 2px;
    padding-bottom: 10px;
    text-transform: uppercase;
    border-bottom: 3px solid #1c1c1c;
}

/*** table description ***/

.wrapper .Over table.cat tr {}
.wrapper .Over table.cat tr:after {
    clear: both;
}

.wrapper .Over table.cat tr td#info {
    font-family: rajdhani;
    font-weight: 100;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding-left: 15px;
    padding-right: 15px;
    vertical-align: top;
    padding-top: 20px;
    width: 250px;
    padding-bottom: 20px;
}

.wrapper .Over table.cat tr td#info a:link {
    color: royalblue;
    text-decoration: none;
    transition: color 0.5s ease;
    padding-bottom: 5px;
    padding-right: 5px;
}

.wrapper .Over table.cat tr td#info a:active {
    color: royalblue;
}

.wrapper .Over table.cat tr td#info a:visited {
    color: royalblue;
}

.wrapper .Over table.cat tr td#info a:hover {
    color: #4760A4;
}

.wrapper .Over table.cat tr td#desc {
    padding-top: 10px;
}

.wrapper .Over table.cat tr td#desc p {
    color: #fff;
    font-family: rajdhani;
    letter-spacing: 1.5px;
    width: 100%;
    padding-top: 10px;
    padding-right: 30px;
    text-align: justify;
}

.wrapper .Over table.cat tr td#stats {
    width: 130px;
    vertical-align: top;
    clear:both;
}

.wrapper .Over table.cat tr td#stats p {
    color: #fff;
    font-family: rajdhani;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 1.5px;
    vertical-align: top;
    float: left;
    width: 50%;
}

.wrapper .Over table.cat tr td#last {
    width: 130px;
    vertical-align: top;
}

.wrapper .Over table.cat tr td#last p {
    color: #fff;
    font-family: rajdhani;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 1.5px;
    vertical-align: top;
    float: left;
    width: 100%;
    clear: both;
}

.wrapper .Over table.cat tr td#border {
    border-bottom: 2px solid #1c192a;
    padding-top: 15px;
}

.wrapper .Over table.cat tr.under h2 {
    padding-left: 30px;
    padding-right: 15px;
    font-family: rajdhani;
    text-align: left;
    font-size: 0.8em;
    font-weight: 100;
    color: #fff;
    letter-spacing: 2px;
    text-shadow: 1px 1px 3px #000, -1px -1px 3px #000;
    text-transform: uppercase;
}

.wrapper .Over table.cat tr.under {
    height: 50px;
    vertical-align: bottom;
}


This is my own code, and i can't get the html behave the same way as in my brackets code..


Last edited by IdaTR on January 14th 2018, 2:54 pm; edited 2 times in total
avatar
IdaTR
Forumember

Female Posts : 477
Reputation : 1
Language : Danish, english
Location : Denmark

http://www.vielamort.net

Back to top Go down

Solved Re: change the forumsection

Post by pedxz on January 13th 2018, 3:55 pm

Hey,
Yes, it is possible, could you send the link from your forum?

thanks,
avatar
pedxz
New Member

Male Posts : 11
Reputation : 2
Language : português

http://power-pixel.net

Back to top Go down

Solved Re: change the forumsection

Post by SLGray on January 13th 2018, 6:31 pm



When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 41432
Reputation : 2840
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: change the forumsection

Post by IdaTR on January 14th 2018, 2:44 pm


ah yea, but its solved i just forgot to mark it ^^
avatar
IdaTR
Forumember

Female Posts : 477
Reputation : 1
Language : Danish, english
Location : Denmark

http://www.vielamort.net

Back to top Go down

Solved Re: change the forumsection

Post by APE on January 14th 2018, 7:22 pm

Problem solved & topic archived.
Please read our forum rules: ESF General Rules



avatar
APE
Manager
Manager

Male Posts : 11420
Reputation : 1099
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum