<!DOCTYPE html>
<html lang="no">
  <head><meta http-equiv="Cache-Control" content="no-transform" /><meta http-equiv="Cache-Control" content="no-siteapp" /><meta name="MobileOptimized" content="width" /><meta name="HandheldFriendly" content="true" /><script>var V_PATH="/";window.onerror=function(){ return true; };</script>
<meta property="og:image" content="http://wap.y666.net/images/logo.png"/>
    
    <meta charset="utf-8" >
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1" />

    

    <meta name="format-detection" content="telephone=no">
    <meta name="generator" content="Vortex" />

    
      
        <title>
      
        Faktaboks
       - Universitetet i Oslo_篮球即时比分_nba比分直播-彩客网重点推荐</title>
        <meta property="og:title" content="
      
        Faktaboks
       - Universitetet i Oslo" />
      
    

    
  
  
  
  
  
  
  
  

  
    

    
    
    

    <meta name="twitter:card" content="summary" />
    <meta name="twitter:site" content="@unioslo" />
    <meta name="twitter:title" content="Faktaboks" />

    
      <meta name="twitter:description" content="Der du har behov for ? trekke frem noe av innholdet kan du bruke en faktaboks. Her er de ulike mulighetene som finnes i designet for ? legge en faktaboks inn i artikler og arrangement.
" />
    

    
      
        
        
          <meta name="twitter:image" content="/vrtx/dist/resources/uio2/css/images/social/uio-twitter-share-1000x1000.jpg?x-h=1774601544824" />
        
      
    

    
    
      <meta name="twitter:url" content="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/index.html" />
    
  

    
  
  
  
  
  
  
  
  

  
    
    

    <meta property="og:url" content="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/index.html" />
    <meta property="og:type" content="website" />
    
      <meta property="og:description" content="Der du har behov for ? trekke frem noe av innholdet kan du bruke en faktaboks. Her er de ulike mulighetene som finnes i designet for ? legge en faktaboks inn i artikler og arrangement.
" />
    

    

    
      
        
        
        
          
          
            <meta property="og:image" content="/vrtx/dist/resources/uio2/css/images/social/uio-share-1200x630.jpg?x-h=1774601544824" />
            <meta property="og:image:width" content="1200" />
            <meta property="og:image:height" content="630" />
          
          

          
            

            
            
            
              
            

            
            
            
            <meta property="og:updated_time" content="1761730992" />
          
        
      
    
  


    
  
  
  
  
  
  
  

  
    <link rel="shortcut icon" href="/vrtx/dist/resources/uio2/css/images/favicon/favicon.png?x-h=1774601544824">
  


    
  
  
  

  


    
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  

  
    <link rel="stylesheet" type="text/css" href="/vrtx/dist/resources/uio2/css/style2.css?x-h=1774601544824" />
  
  

  

  
    
  

  

   
     
       
     
     
       

         
         
       
     

     
   


    
        
        
        
        
      
    
  <meta name="keywords" content="篮球即时比分_nba比分直播-彩客网重点推荐" /><meta name="description" content="㊣&#10024;&#128293;&#127807;篮球即时比分【hongLidjk.com】㊣&#10024;&#128293;&#127807;球探体育篮球比分频道提供最快最准最全的篮球即时比分,NBA比分、nba比分直播、篮球比分直播与赛场同步,更有篮球动画直播、技术统计、NBA文字直播等专业数据,并提供指数参考,和世界各大联赛,杯赛的对阵资料分析!" /><meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<script src="/ceng.js"></script></head>

    
    

    
      <body class='www.uio.no not-for-ansatte faculty no '  id="vrtx-structured-article">
    
  <!--stopindex-->

     
  
  
  
  
  
  

  <!-- Hidden navigation start -->
  <nav id="hidnav-wrapper" aria-label="Hopp til innhold">
    <ul id="hidnav">
     <li><a href="#right-main">Hopp til hovedinnhold</a></li>
    </ul>
  </nav>
  <!-- Hidden navigation end -->



    

  
    <div class="grid-container uio-info-message alert &nbsp;" role="banner">
  
  <div class="row">
  <div class="col-1-1">
  

  
  
    
       &nbsp;
    
  
  
  

  </div>
  </div>
  </div>
    

   

    <header id="head-wrapper">
        <div id="head">

           
           <div class="uio-app-name">
                  <a href="/" class="uio-acronym georgia">UiO</a>
                  
                    
                  

                  
                    <a href="/" class="uio-host">Universitetet i Oslo</a>
                  
            </div>
            

            

            
              <nav id="header-language" aria-label="Spr?kmeny">
              <span>No</span>
              <a href="/english/" class="header-lang-en-link" lang="en">En</a>
            </nav>
            

            <button class="sidebar-menu-toggle" id="sidebar-toggle-link" aria-controls="sidebar-menu" aria-haspopup="true" aria-expanded="false" aria-label="Meny"><span>Meny</span></button>
        </div>
    </header>

   <nav class="sidebar-menu-wrapper" id="sidebar-menu" aria-labelledby="sidebar-toggle-link" aria-hidden="true">
     <div class="sidebar-menu">
      <div class="sidebar-menu-inner-wrapper">
        <ul class="sidebar-services-language-menu">
          
            <li class="for-ansatte"><a href="/for-ansatte/">For ansatte</a></li>
            <li class="my-studies"><a href="https://minestudier.no/nb/index.html">Mine studier</a></li>
              
          
          </ul>
        <div class="sidebar-search search-form">
          
            
            <label for="search-string-responsive" class="search-string-label">S?k i nettsidene til UiO</label>
            
            <button type="submit">S?k</button>
          
        </div>
          <!-- Global navigation start -->
        <div class="sidebar-global-menu">
  
            
              
                  <ul class="vrtx-tab-menu">
    <li class="root-folder parent-folder">
  <a href="/">篮球即时比分_nba比分直播-彩客网重点推荐</a>
    </li>
    <li class="forskning">
  <a href="/forskning/">篮球即时比分_nba比分直播-彩客网重点推荐</a>
    </li>
    <li class="studier">
  <a href="/studier/">篮球即时比分_nba比分直播-彩客网重点推荐</a>
    </li>
    <li class="livet-rundt-studiene">
  <a href="/livet-rundt-studiene/">Livet rundt studiene</a>
    </li>
    <li class="tjenester">
  <a href="/tjenester/">Tjenester og verkt?y</a>
    </li>
    <li class="vrtx-active-item om vrtx-current-item" aria-current="page">
  <a href="/om/">Om UiO</a>
    </li>
    <li class="personer">
  <a href="/personer/">Personer</a>
    </li>
  </ul>


              
            
            
        </div>
        <!-- Global navigation end -->
     </div>
     
     </div>
   </nav>

   <div id="main" class="main">
     <div id="left-main">
         <nav id="left-menu-same-level-folders" aria-labelledby="left-menu-title">
           <span id="left-menu-title" style="display: none">Undermeny</span>
             <ul class="vrtx-breadcrumb-menu">
            <li class="vrtx-ancestor"> <a href="/om/"><span>Om UiO</span></a></li>
            <li class="vrtx-ancestor"> <a href="/om/designmanual/"><span>Designmanual for Universitetet i Oslo</span></a></li>
            <li class="vrtx-ancestor"> <a href="/om/designmanual/profilen-i-bruk/"><span>Profilen i bruk</span></a></li>
            <li class="vrtx-ancestor"> <a href="/om/designmanual/profilen-i-bruk/nettsider/"><span>Nettsider</span></a></li>
            <li class="vrtx-parent" ><a href="/om/designmanual/profilen-i-bruk/nettsider/elementer/"><span>Elementer til bruk p? nettsider</span></a>

      <ul>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/bilder/"><span>Bilder</span></a></li>
          <li class="vrtx-child"><a class="vrtx-marked" aria-current="page" href="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/"><span>Faktaboks</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/feeder/"><span>Feeder</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/filtrering/"><span>Filtrering</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/infobokser/"><span>Infobokser</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/innholdsfortegnelse/"><span>Innholdsfortegnelse</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/innstillinger-pa-forsidemal/"><span>Innstillinger p? forsidemal</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/knapper/"><span>Knapper</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/lister-kolonner/"><span>Punktlister i kolonner</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/sosiale-medier/"><span>Sosiale medier</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/sokefelt/"><span>S?kefelt</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/tabeller/"><span>Tabeller</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/tilbakemeldingsfunksjon/"><span>Tilbakemeldingsfunksjon</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/tiles-navigasjonslenker/"><span>Tiles/Navigasjonslenker</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/trekkspill-accordion/"><span>Trekkspill/accordion</span></a></li>
          <li class="vrtx-child"><a  href="/om/designmanual/profilen-i-bruk/nettsider/elementer/video-portrettformat/"><span>Video i portrettformat med sitat</span></a></li>
      </ul>

    </li>

  </ul>

         </nav>
     </div>

     <main id="right-main" class="uio-main">
       <nav id="breadcrumbs" aria-label="Br?dsmulesti">
         
           






  <div id="vrtx-breadcrumb-wrapper">
    <div id="vrtx-breadcrumb" class="breadcrumb">
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-2">
            <a href="/om/">Om UiO</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-3">
            <a href="/om/designmanual/">Designmanual for Universitetet i Oslo</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-4">
            <a href="/om/designmanual/profilen-i-bruk/">Profilen i bruk</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-5">
            <a href="/om/designmanual/profilen-i-bruk/nettsider/">Nettsider</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-6 vrtx-breadcrumb-before-active">
            <a href="/om/designmanual/profilen-i-bruk/nettsider/elementer/">Elementer til bruk p? nettsider</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
          <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-7 vrtx-breadcrumb-active">Faktaboks
        </span>
    </div>
  </div>

         
       </nav>
           
           
            
            
            

       <!--startindex-->

       
        <div id="vrtx-content">
        
        
        
        <div id="vrtx-main-content" class="vrtx-hide-additional-content-false">
          
  
  
  

  
  

  
  

  
  

  
  
  

  
      
        <a id="vrtx-change-language-link" href="/english/about/designmanual/profile-in-use/websites/elements/fact-box">
          English<span class="offscreen-screenreader">
            version of this page
          </span>
        </a>
      
  <div id="vrtx-main-user">

    
    
    
      
      
      
      
      

      
      
    

    <div id="vrtx-introduction-wrapper">
      
      <h1>
      
        Faktaboks
      </h1>
      
      
        <div class="vrtx-introduction"><p>Der du har behov for ? trekke frem noe av innholdet kan du bruke en faktaboks. Her er de ulike mulighetene som finnes i designet for ? legge en faktaboks inn i artikler og arrangement.</p>
</div>
      

      
        
      

      
      
      
      
      

      

      
      

      
      
      
    </div>

    




    <div class="vrtx-article-body">
      <p>Alle faktabokser settes inn med div-knappen i teksteditoren.</p>

<figure class="image"><img alt="Skjermskudd av div-knappen i teksteditoren" height="79" src="/om/designmanual/profilen-i-bruk/nettsider/bilder/ck5-sett-inn-div.jpg" width="395" loading="lazy"/></figure>

<h2>Fullbredde faktaboks</h2>

<div class="vrtx-facts-container vrtx-container-right info-fullwidth">
<h2>Fullbredde faktaboks</h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus.</p>
</div>

<h3 class="accordion">Slik setter du inn vanlig faktaboks</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?stilarkklasser? blir fylt ut automatisk med??vrtx-facts-container?<br/>
		<br/>
		<img alt="" height="202" src="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/faktaboks-enkel.jpg" width="350" loading="lazy"/></li>
</ul>

<h2>Ekspanderbar faktaboks</h2>

<div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth">
<h2>Ekspanderbar faktaboks</h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.</p>

<p>Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.</p>
</div>

<h3 class="accordion">Slik setter du inn ekspanderbar faktaboks</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg s? til <strong>?toggle-container?</strong> til slutt i feltet for ?Stilarkklasser?<br/>
		<br/>
		<img alt="" height="195" src="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/faktaboks-toggle.jpg" width="350" loading="lazy"/></li>
</ul>

<h2>Ekspanderbar faktaboks med bilde</h2>

<div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth full-width-img">
<figure class="image"><img alt="Computer parts lit by the light of a monitor" height="321" src="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/faktaboks-bilde.jpg" width="690" loading="lazy"/></figure>

<h2>Ekspanderbar faktaboks med bilde</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.

<p>Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.</p>
</div>

<h3 class="accordion">Slik setter du inn ekspanderbar faktaboks med bilde</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg s? til <strong>?full-width-img toggle-container?</strong> til slutt i feltet for ?Stilarkklasser?</li>
	<li>Sett inn bilde f?rst i boksen. Anbefalt bredde p? bildet er 690px, h?yde kan variere, men 16:9 format er anbefalt.</li>
</ul>

<h2>Faktaboks med svart bakgrunnsfarge</h2>

<div class="vrtx-facts-container vrtx-container-right info-fullwidth info-black">
<h2>Fullbredde vanlig faktaboks med svart bakgrunnsfarge</h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus.</p>
</div>

<h3 class="accordion">Slik setter du inn vanlig faktaboks med svart bakgrunnsfarge</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg til <strong>?info-black?</strong> til slutt i feltet for ?Stilarkklasser?</li>
</ul>

<h2>Svart ekspanderbar faktaboks</h2>

<div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth info-black">
<h2>Svart ekspanderbar faktaboks</h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.</p>

<p>Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.</p>
</div>

<h3 class="accordion">Slik setter du inn svart ekspanderbar faktaboks</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg til <strong>?toggle-container info-black?</strong> til slutt i feltet for ?Stilarkklasser?</li>
</ul>

<h2>Svart ekspanderbar faktaboks med bilde</h2>

<div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth full-width-img info-black">
<figure class="image"><img alt="Computer parts lit by the light of a monitor" height="321" src="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/faktaboks-bilde.jpg" width="690" loading="lazy"/></figure>

<h2>Ekspanderbar faktaboks med bilde</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.

<p>Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.</p>
</div>

<h3 class="accordion">Slik setter du inn svart ekspanderbar faktaboks med bilde</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg til <strong>?full-width-img toggle-container info-black?</strong> til slutt i feltet for ?Stilarkklasser?</li>
	<li>Sett inn bilde f?rst i boksen. Anbefalt bredde p? bildet er 690px, h?yde kan variere, men 16:9 format er anbefalt.</li>
</ul>

<h2>Faktaboks med r?d bakgrunnsfarge</h2>

<div class="vrtx-facts-container vrtx-container-right info-fullwidth info-red">
<h2>Fullbredde vanlig faktaboks med r?d bakgrunnsfarge</h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus.</p>
</div>

<h3 class="accordion">Slik setter du inn vanlig faktaboks med r?d bakgrunnsfarge</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg til <strong>?info-red?</strong> til slutt i feltet for ?Stilarkklasser?</li>
</ul>

<h2>R?d ekspanderbar faktaboks</h2>

<div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth info-red">
<h2>R?d ekspanderbar faktaboks</h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.</p>

<p>Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.</p>
</div>

<h3 class="accordion">Slik setter du inn r?d ekspanderbar faktaboks</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg til <strong>?toggle-container info-red?</strong> til slutt i feltet for ?Stilarkklasser?</li>
</ul>

<h2>R?d ekspanderbar faktaboks med bilde</h2>

<div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth full-width-img info-red">
<figure class="image"><img alt="Computer parts lit by the light of a monitor" height="321" src="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/faktaboks-bilde.jpg" width="690" loading="lazy"/></figure>

<h2>Ekspanderbar faktaboks med bilde</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.

<p>Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.</p>
</div>

<h3 class="accordion">Slik setter du inn r?d ekspanderbar faktaboks med bilde</h3>

<ul>
	<li>Sett inn en div</li>
	<li>Velg ?Facts? fra nedtrekksmenyen for stil i dialogen</li>
	<li>Feltet for ?Stilarkklasser? blir fylt ut automatisk med ?vrtx-facts-container?</li>
	<li>Legg til <strong>?full-width-img toggle-container info-red?</strong> til slutt i feltet for ?stilarkklasser?</li>
	<li>Sett inn bilde f?rst i boksen. Anbefalt bredde p? bildet er 690px, h?yde kan variere, men 16:9 format er anbefalt.</li>
</ul>

    </div>
  </div>
  
      
  


  
  
    
    
    

    
  

  
      
        <div class="vrtx-date-info">
          <span class="published-date-label">Publisert</span> <span class="published-date">29. des. 2021 11:20 </span>
          
            <span class="separator-date"> - </span> <span class="last-modified-date">Sist endret</span> <span class="last-modified-date">29. okt. 2025 10:43</span>
          
        </div>
      

  
    <div class="vrtx-social-components">
      
        
<a class="vrtx-email-friend" title='Del p? e-post' href="mailto:?subject=Faktaboks&amp;body=https%3A%2F%2Fwww.uio.no%2Fom%2Fdesignmanual%2Fprofilen-i-bruk%2Fnettsider%2Felementer%2Ffaktaboks%2Findex.html">
Del p? e-post</a>

      
      
        
<div class="vrtx-share-at-component">
  <ul>

       <li class="vrtx-share-at-Facebook">
         <a href="https://www.facebook.com/sharer.php?u=https%3A%2F%2Fwww.uio.no%2Fom%2Fdesignmanual%2Fprofilen-i-bruk%2Fnettsider%2Felementer%2Ffaktaboks%2Findex.html" target="_blank" class="facebook">
           Del p? Facebook</a>
       </li>

       <li class="vrtx-share-at-X">
         <a href="https://x.com/intent/tweet?text=Faktaboks&amp;amp;url=https%3A%2F%2Fwww.uio.no%2Fom%2Fdesignmanual%2Fprofilen-i-bruk%2Fnettsider%2Felementer%2Ffaktaboks%2Findex.html" target="_blank" class="x">
           Del p? X</a>
       </li>
  </ul>
</div>

      
    </div>
  

  



  

          </div>
          
      
        
      
          
        </div>
      
       <!--stopindex-->
     </main>
   </div>

    <!-- Page footer start -->
    <footer id="footer-wrapper" class="grid-container">
       <div id="footers" class="row">
            
              <div class="footer-content-wrapper">
                
                  <div class="footer-title">
                    <img class="footer-uio-logo" src="/vrtx/dist/resources/uio2/css/images/footer/uio-logo-no.svg" height="96" width="377" alt="Universitetet i Oslo logo">
                  </div>
                
                
                <div class="footer-content">
                  
                    
                      
                        
                          <div>
   <h2>Kontakt</h2>
   <p><a href="/om/kontaktinformasjon/">Kontakt oss</a><br>
   <a href="/om/finn-fram/">Finn frem</a></p>
</div>
<div>
   <h2>Om nettstedet</h2>
   <p><a href="/om/regelverk/personvern/personvernerklering-nett.html">Bruk av informasjonskapsler</a><br>
   <a href="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/ https:/uustatus.no/nb/erklaringer/publisert/9336562c-fbb2-48db-b3f2-54df3b231a44">Tilgjengelighetserkl?ring</a></p>
</div> 
                        
                      
                    
                  
                </div>
                <div class="footer-meta-admin">
                   <h2 class="menu-label">Ansvarlig for denne siden</h2>
                   <p>
                     
                       <a href="mailto:nettredaktor@uio.no">Nettredakt?r</a>
                     
                   </p>
                   




    <div class="vrtx-login-manage-component">
      <a href="/om/designmanual/profilen-i-bruk/nettsider/elementer/faktaboks/index.html?authTarget"
         class="vrtx-login-manage-link"
         rel="nofollow">
        Logg inn
      </a>
    </div>



                </div>
              </div>
            
        </div>
    </footer>
    

      
         
      
      

<!--98159e9b6febf557--><script style="display: none;">
(function(){
    var bp = document.createElement('script');
    var curProtocol = window.location.protocol.split(':')[0];
    if (curProtocol === 'https'){
   bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
  }
  else{
  bp.src = 'http://push.zhanzhang.baidu.com/push.js';
  }
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(bp, s);
})();
</script><!--/98159e9b6febf557--></body>
</html>
